PickaDummy.com is a service that offers you random generated images via a special url.
You can use these images in your website as dummy images, also known as placeholder images.
You can simply place the url in your image html tag:
<img src="https://i.pickadummy.com/600x400">

Image Size
Creating a random dummy image is super simple!
Just place the image size you want after the pickadummy.com
URL.
https://i.pickadummy.com/300x100
https://i.pickadummy.com/300


Colorize
By colorizing the image, the image will only use different shades of the given color.
You can use this - for example - to make image match the main color of your website.
Just pass the rgb value to the url.
For instance, to make an image only use red tones, colorize=FF3333
or col=f33





Wash
By washing the image, the image will mainly use colors close to the given color. So not only shades of
the given color like the
colorize
option.
You can use this - for example - to make image match the main color of your website.
Just pass the rgb value to the url.
For instance, to make an image primarily use red tones, wash=CC3333
or w=c33





Note: The more the color is close to mid-tones, the more different colors will be included.
Greyscale
Create a greyscale image by using greyscale=yes
or g=yes
https://i.pickadummy.com/300x150?greyscale=yes

You can also set a number from 1
to 5
to set different 5 (not 50) shades of
grey.





Brightness
Set the brightness using brightness=...
You can choose a number from -2
to 2
(0
= no
change)





Contrast
Change the contrast using contrast=...
You can choose a number from -2
to 2
(0
= no
change)





Combinations
You can combine the different filters to create desired effects.





Border
Set a border around the image by giving the border thickness (in pixels) and the color using border=20&bordercolor=97abe5
or
b=20&bc=97abe5
https://i.pickadummy.com/300x150?border=2&bordercolor=000000
https://i.pickadummy.com/300x150?border=20&bordercolor=97abe5


Dimensions
Add the dimensions to lower left corner of the image using dimensions=yes
or
d=1
https://i.pickadummy.com/300x200?dimensions=yes

Text
Add custom text to the image using text=My Text
or t=My Text
https://i.pickadummy.com/300x150?text=My Text

To split a text over multiple lines, place \n
where you want the break to be, like
text=My\nText
https://i.pickadummy.com/300x150?text=Multiple lines\nof text\nare no problem\nfor PickaDummy.com

Dimensions
To place the dimensions as a text, you can use text={dimensions}
https://i.pickadummy.com/300x150?text={dimensions}&font=3Dumb

Fonts
Choose any of these fonts by using font=Font Name
or f=Font Name
https://i.pickadummy.com/300x150?text=My Text&font=Capture It
2Dumb

3Dumb

1942 report

Alex Bush

Aller

Amatic

Aquiline Two

Capture It

Caviar Dreams

Droid Sans Mono

FFF Tusj

Journal

Lato

Open Sans

Pacifico

Raleway

Roboto

Ubuntu

Ubuntu Mono

Windsong

Size
Control the size of the text by setting the font size in pixels, like fontsize=123
or
s=123
The default size is 40
https://i.pickadummy.com/300x300?fontsize=90&text=Hi!
Note: The text will automatically get sized to a smaller font size if it doesn't fit.

Position
By default the text is placed in the center of the image.
However you can use these positions to place the text somewhere else:
c
orcenter
(default)t
ortop
b
orbottom
l
orleft
r
orright
tl
ortopleft
tr
ortopright
bl
orbottomleft
br
orbottomright
Just place the position in the url, like position=bottomright
or pos=br
https://i.pickadummy.com/300x300?position=top&text=Up here!
https://i.pickadummy.com/300x300?position=bottomright&text=In the corner!


Color
By default the text will be white. But you can override this with any color you want.
Just pass the rgb color in the url.
For instance, for bright red text you can use color=FF0000
or c=f00
https://i.pickadummy.com/300x300?color=ffb700&text=Yellow
Note: The text will automatically get sized to a smaller font size if it doesn't fit.

Shadow
To make the text stand out a bit more, you can give it a shadow.
Just pass the rgb color of the desired shadow in the url.
For instance, for a black shadow under your text you can use shadow=000000
https://i.pickadummy.com/300x300?shadow=000000&color=40b445&text=Black shadow
https://i.pickadummy.com/300x300?shadow=ffffff&color=000000&text=White shadow


Outline
You can also add an outline (stroke) to the text to make the text stand out more.
Just pass the rgb color of the desired outline in the url.
For instance, for a black outline around your text you can use outline=000000
https://i.pickadummy.com/300x300?outline=000000&color=97abe5&text=Black outline
https://i.pickadummy.com/300x300?outline=ffffff&color=000000&text=White outline


Transparency
To have a more transparent text you can set the transparency
to a number between
0
and 100
, like
transparency=50
https://i.pickadummy.com/300x300?transparency=50&text=I'm a Ghost

Angle
Rotate the text to a desired angle, by setting a value between 0
and 360
,
like angle=30
https://i.pickadummy.com/300x300?angle=30&text=All Wonky!
https://i.pickadummy.com/300x300?angle=270&position=left&text=All Sideways!


Caching
If you want to return the same generated image every time, you can use a cached image with cache=1
If you want to use cached multiple images with exactly the same settings, but want them to be different, you can give them a different caching number:
https://i.pickadummy.com/300x150?cache=1&text=Cached Image
https://i.pickadummy.com/300x150?cache=2&text=Cached Image


Overview
Here is an overview of all the possible url attributes you can add to the url, after the main dimensions.
Attribute | Shorthand | Value |
---|---|---|
colorize |
col |
Any RGB color |
wash |
w |
Any RGB color |
greyscale |
g |
yes or 1 to 5 |
brightness |
b |
-2 to 2 |
contrast |
c |
-2 to 2 |
border |
b |
Size in pixels |
bordercolor |
bc |
Any RGB color |
dimensions |
d |
yes or 1 |
text |
t |
Any text |
font |
f |
One of the available font names |
fontsize |
s |
Size in pixels |
position |
pos |
center , top , bottom , left ,
right , topleft , topright , bottomleft ,
bottomright
or c , t , b , l , r ,
tl , tr , bl , br
|
color |
c |
Any RGB color |
shadow |
Any RGB color | |
outline |
Any RGB color | |
transparency |
0 to 100 |
|
angle |
0 to 360 |
|
cache |
1 to 100 |
Limitations
Size
The maximum width and height of an image is 1200px
.
If you request a size larger than this, the dimensions will be resized to this maximum maintaining the
aspect ratio.