Fake Images Please

2012 · Python · Website · Source

When designing websites, you may not have the images you need at first. But you already know the sizes, and inserting some placeholders can help you see the layout more clearly. Don’t waste your time making dummy images for your mockup or wireframe. Fakeimg.pl is a little tool that generates images with a URL. Choose the size, the colors, even the text. It’s free and open source.

How to use

You just have to put your image size after the URL. Only the first parameter is mandatory. There are options too: you can pass text or change some colors. Colors must be hexadecimal; the first one is the background color. The text can be passed with the text GET variable. Here are some examples you can look at:

1
2
3
4
5
6
7<img src="https://fakeimg.pl/300/">
<img src="https://fakeimg.pl/250x100/">
<img src="https://fakeimg.pl/250x100/ff0000/">
<img src="https://fakeimg.pl/350x200/ff0000/000">
<img src="https://fakeimg.pl/350x200/?text=Hello">
<img src="https://fakeimg.pl/350x200/?text=オラ&font=noto">
<img src="https://fakeimg.pl/350x200/?text=World&font=lobster">

Use them directly in an image tag, as a CSS background, or however you like.

Change font

There are three bonus fonts you can choose by passing font=lobster, font=bebas, or font=museo in the URL. The font=noto option is also available for Chinese, Japanese, and Korean text.

Change font size

You can manually change the font size by passing in the URL font_size=12.

Retina mode

Just pass retina=1 in the URL. Your image will be twice as large.

Asian text support

You can use the noto font to support Japanese, Korean, and Chinese text.

Transparency

Both the background and text colours support transparency (0–255) by adding an alpha value after the colour.

1
2<img src="https://fakeimg.pl/350x200/ff0000,128/000">
<img src="https://fakeimg.pl/350x200/ff0000,128/000,10">

Emojis and Discord emotes support in text

The format for Discord emotes looks like this: <:rooThink:596576798351949847>

Set up your own instance

Prerequisites:

• Docker

1
2
3# Run the image (change the port if you need)
$ docker run -d -p 80:80 rydgel/fakeimg:latest
# Open the browser at http://127.0.0.1:80

Source and website

The website is available here, and the source code is on GitHub.

Back to Experiments · see also Monkey language interpreter made in Rust · Home.