Documentation
Getting Started
fallback.pics is a lightning-fast placeholder image service that requires zero setup. Simply use our URLs directly in your HTML, and we'll generate images on-demand.
<img src=https://fallback.pics/api/v1/400x300 alt="Placeholder">
Basic Usage
The simplest way to use fallback.pics is to specify dimensions in the URL path.
Rectangle
https://fallback.pics/api/v1/600x400
Square
https://fallback.pics/api/v1/200
Dimensions
Size Range: 10x10 pixels to 4000x4000 pixels
Minimum Size
https://fallback.pics/api/v1/10x10
Large Size
https://fallback.pics/api/v1/1200x600
Image Formats
Support for all modern image formats. Simply add the extension to your URL.
SVG
Vector, scalable
.svg
PNG
Lossless
.png
JPEG
Compressed
.jpg
WebP
Modern
.webp
AVIF
Next-gen
.avif
GIF
Legacy
.gif
https://fallback.pics/api/v1/400x300.webp
Colors
Customize background and text colors using hex codes or CSS color names.
Path-based Colors
https://fallback.pics/api/v1/400x300/3B82F6/FFFFFF
Query Parameters
https://fallback.pics/api/v1/400x300?bg=FF0000&fg=FFFFFF
CSS Color Names
https://fallback.pics/api/v1/400x300?bg=navy&fg=gold
Transparent Background
https://fallback.pics/api/v1/400x300?bg=transparent
Available CSS Colors
Text Customization
Custom Text
https://fallback.pics/api/v1/400x300?text=Product+Image
Multi-line Text
Use \n for line breaks
https://fallback.pics/api/v1/400x300?text=Line+1\nLine+2\nLine+3
Font Size
https://fallback.pics/api/v1/400x300?text=Large&fontSize=48
Font Selection
Choose from 11 professional font families.
System UI
?font=system
Sans Serif
?font=sans
Serif
?font=serif
Monospace
?font=mono
Inter
?font=inter
Roboto
?font=roboto
Lato
?font=lato
Montserrat
?font=montserrat
Open Sans
?font=opensans
Raleway
?font=raleway
Poppins
?font=poppins
Presets
Pre-configured layouts for common use cases.
Avatar
Perfect for user profiles
https://fallback.pics/api/v1/avatar/100
https://fallback.pics/api/v1/avatar/100?text=JD
Banner
Wide format for headers
https://fallback.pics/api/v1/banner/1200x400
Blur Effect
Blurred placeholder effect
https://fallback.pics/api/v1/blur/400x300
Skeleton Loader
Loading state placeholder
https://fallback.pics/api/v1/skeleton/400x300
AI-Powered Generation
Generate contextually relevant placeholders based on industry and mood.
E-commerce
?context=e-commerce&mood=minimal
Technology
?context=tech&mood=futuristic
Healthcare
?context=healthcare&mood=calm
Fashion
?context=fashion&mood=elegant
Available Contexts
- • e-commerce
- • tech
- • healthcare
- • education
- • finance
- • travel
- • food
- • fashion
Available Moods
- • vibrant
- • minimal
- • professional
- • playful
- • elegant
- • bold
- • calm
- • futuristic
Animated Placeholders
CSS-only animations for loading states. Supports reduced motion for accessibility.
skeleton
Shimmer effect
animated/skeleton/300x200
pulse
Pulsing opacity
animated/pulse/300x200
wave
Wave animation
animated/wave/300x200
shimmer
Light sweep
animated/shimmer/300x200
gradient
Rotating gradient
animated/gradient/300x200
dots
Loading dots
animated/dots/300x200
Accessibility: Add ?reducedMotion=true
to disable animations for users who prefer reduced motion.
Data Visualization Placeholders
Professional chart mockups for dashboards and analytics interfaces.
Bar Chart
chart/bar/600x400
Pie Chart
chart/pie/600x400
Line Chart
chart/line/600x400
Area Chart
chart/area/600x400
Donut Chart
chart/donut/600x400
Scatter Plot
chart/scatter/600x400
Radar Chart
chart/radar/600x400
Heatmap
chart/heatmap/600x400
Retina Support
Generate high-resolution images for retina displays.
Standard (1x)
200x200
Retina (2x)
200x200?retina=2
Renders at 400x400, displays at 200x200
Super Retina (3x)
200x200?retina=3
Renders at 600x600, displays at 200x200