How to use
- Drop a picture onto the box, or choose it.
- Type the top text and the bottom text. Each is capitalized and centered automatically, and its size shrinks to fit the picture if it is long.
- Change the text color and outline color if you like, and choose between Impact (the classic meme font, where your device has it) and a plain bold font.
- Press Download, or right-click (press and hold on a phone) the picture to save it.
Examples
A picture with top text "WHEN THE CODE" and bottom text "FINALLY WORKS"
→ The picture with both lines in bold white letters with a black outlineThe classic meme layout: one line at the top, one at the bottom.
A long line of top text on a small picture
→ The text wraps onto two lines and shrinks to fitThe text is never cut off or pushed outside the picture.
Only bottom text typed, top left empty
→ Just the bottom caption is drawnAn empty box draws nothing, for memes that only need one line.
How it works
The picture is drawn onto a canvas at its own size, and each caption is fit to it in your browser: the text is measured at a starting size, wrapped onto as many lines as it needs so no line is wider than the picture (minus a small margin), and the size is lowered a little at a time until the wrapped text fits both the width and a height limit, or a minimum size is reached. The text is then drawn centered, with a thick stroke in the outline color drawn first and the fill color on top, the classic meme look.
The wrapping and fitting logic is covered by tests, using a fake, predictable measurement of text width; the real measuring (CanvasRenderingContext2D.measureText) and drawing are exercised through the page in a real browser.
Sources
Frequently asked questions
- Why does the text turn into capital letters?
- That is the classic meme style, used so the page does not have to decide whether to keep your own capitalization. Type however you like; it is shown in capitals either way.
- Why does Impact look different on my phone?
- Impact is a font that comes with Windows and Mac but usually not with phones, and a browser can only use a font that is actually installed on the device, since nothing is downloaded. On a device without it, the page falls back to a bold font from your system, which still reads fine but looks a little different.
- Can I use a GIF?
- You can drop one in, but only its first frame is used, since the picture is drawn once onto a plain canvas rather than kept as an animation.
- Is there a limit to how much text I can add?
- Up to 120 characters a line. Longer text wraps onto more lines and shrinks further, down to a minimum size, so very long captions can end up small.
- Is my picture uploaded?
- No. The picture and the text are drawn together in your browser, and nothing is sent anywhere.
Related tools
Version history
- 1.0.1 — Clarifies the search title with the tool's main task and whether it is free or runs online.
- 1.0.0 — First release.