The Lorem Ipsum for images - easily include placeholder images on websites
May 13, 2019
"Lorem ipsum" is probably the best-known dummy text par excellence. This has no special meaning, but should help to get an impression for the layout. Now there is also a simple solution for all Web designer and developers: Lorem Picsum.
Simple placeholder images in the appropriate size
The use is very simple. You simply append the desired image size (width and height) to the URL of the tool and you get a suitable placeholder image.
Example of an image with the width 800px and the height 600px:
https://picsum.photos/1100/400
The resulting image will look like this:
For square images, it is sufficient to specify the side length once:
https://picsum.photos/400
Use specific image
Instead of displaying a random image, you can also select a specific motif. For this you have to enter in the URL /id/{image}
where {image} must be replaced with the image ID:
https://picsum.photos/id/1/200
A list with all motifs can be found here: Motif list Picsum
More functions
Grayscale
https://picsum.photos/200/300?grayscale
Blur
https://picsum.photos/200/300/?blur
The degree of blur can take a value between 1 and 10:
https://picsum.photos/200/300/?blur=5
Filter combinations
Image in grayscale and with blur:
https://picsum.photos/id/870/200/300?grayscale&blur=3
More functions can be found on the official Website can be looked up. Have fun!
No Comments