step1_title
step1_desc
https://lorempics.com/350x150
Lorempics
The Quick & Simple Image Placeholder Service for Developers.
Configure your placeholder image
Live Preview
How It Works
step2_title
step2_desc
<img src="https://lorempics.com/350x150" />
step3_title
step3_desc
https://lorempics.com/150x150/5CB85C/FFF
step4_title
step4_desc
https://lorempics.com/200x100?fs=30&r=15
Parameter Reference
| Parameter | Type | Description | Example |
|---|---|---|---|
| Width × Height | Path | param_size_desc | /400x300 |
| Background Color | Path | param_bgcolor_desc | /400x300/CCC |
| Text Color | Path | param_textcolor_desc | /400x300/CCC/000 |
| text | Query | param_text_desc | ?text=My+Label |
| fs | Query | param_fs_desc | ?fs=24 |
| align | Query | param_align_desc | ?align=tl |
| r | Query | param_r_desc | ?r=20 |
| type | Query | param_type_desc | ?type=jpg |
Live Demo
Every image below was generated with a single URL. Click any to open full-size.
Color Combinations
Same dimensions, different background and text color palettes.
Corner Radius Variations
From sharp to fully rounded — controlled with the r parameter.
Text Alignment Positions
Place text in any of the 9 anchor points with align.
Font Size Control
Scale text from small labels to large headings with fs.
Real-World Use Cases
Common placeholder scenarios: hero banners, avatars, ad slots, product cards.