Guide
How it works, from typing to PNG
No account, no upload to a third party, no watermark. Here is exactly what happens between your keystroke and the file on your disk.
Step 1 — Type the text you want to turn into an image
The text box accepts up to four lines and sixty characters per line. Line breaks are respected: press Enter to start a new line, and every line is centred automatically. Emoji and accented letters are supported by the bundled fonts, but unusual scripts (Arabic, Hebrew, Devanagari, Thai) need right-to-left or complex shaping engines that the GD library does not provide — those characters would render as empty boxes, so keep the text in Latin, Greek, Cyrillic or CJK for a predictable result.
Step 2 — Choose a colour style
Every thumbnail in the style grid is a real rendering of that style, not a mock-up. Click a card and the big preview updates within a moment. All twelve styles share the same building blocks:
- Fill — a linear gradient defined by an angle and a set of colour stops.
- Stroke — the glyph mask expanded by a few pixels and painted with its own colour, which is what makes soft gradients readable.
- Glow — the mask expanded and blurred, then blended behind the letters.
- Shadow — the same mask blurred and offset, blended under everything else.
Step 3 — Pick the canvas
Auto crops the canvas tightly around the text with a small breathing margin. That is the right choice for stickers, overlays and thumbnails that will be scaled by the platform anyway. Presets lock the output to a known size:
| Preset | Pixels | Use it for |
|---|---|---|
| Square | 1080 × 1080 | Instagram feed, profile picture, marketplace listings |
| Post | 1080 × 1350 | Instagram portrait post, Pinterest pin |
| Story | 1080 × 1920 | Instagram / Facebook story, TikTok photo, YouTube Shorts cover |
| Wide | 1200 × 630 | Open Graph preview, blog header, YouTube thumbnail |
Step 4 — Choose a background
Transparent output is the most useful option: the PNG keeps its alpha channel, so the letters sit on top of any photo or video without a white rectangle around them. Dark and white are solid fills that are handy when you want a ready-to-post square, and the colour picker accepts any hex value if you need to match a brand palette.
Step 5 — Download or copy
Download PNG saves the exact image you see, at the canvas resolution you chose. Copy image writes the PNG to the clipboard so you can paste it straight into a chat, a design tool or a video editor.
What happens on the server
The browser never draws the letters. It only asks the server for an image URL that contains your text and settings. The server then:
- measures the text with FreeType to find the glyph box for each line;
- rasterises the text into an anti-aliased alpha mask;
- expands and blurs that mask to build the glow, shadow and stroke layers;
- generates a gradient and composites it through the mask, pixel by pixel;
- encodes the result as a PNG and caches it by an MD5 of the parameters.
Because the gradient and the mask are produced at the final resolution, there is no upscaling step, and the edges stay clean at 1920 pixels. The cache means a popular combination is only rendered once, which keeps the site fast for everybody else.
Getting the best result
- Two or three words per line is the sweet spot. Long sentences force the font size down and the gradient becomes hard to see.
- Use capitals in Bebas Neue and Anton; those designs are built for uppercase and look weak in lowercase.
- Keep a dark background for neon, fire, galaxy and outline — those styles rely on light bleed.
- Test at small size: shrink the preview mentally to avatar size. If the words stop being readable, switch to a bolder font or a simpler style.
Still stuck? The FAQ covers common rendering problems, and you can always send us a message.