How to Make a Quote or Announcement Card in Your Browser

There's no "Run" step here - Social quote & caption card maker redraws the card live as you type or change an option, and Download just saves whatever's currently on screen. Here's the actual process.

Step 1 - type your headline

Download stays disabled with a plain hint until there's some text in the headline or the subtext, so you're never handed a blank card by accident. Subtext is a second, smaller line underneath.

Step 2 - choose a background

Three options: a solid color, a two-stop gradient, or your own photo. Choosing Photo reveals the file picker; the photo is decoded and drawn locally, and a dark overlay is applied over it automatically so light text stays readable regardless of how bright or busy the photo underneath is. Nothing about the photo is ever sent anywhere.

Step 3 - pick a style and alignment

Three style presets change how the text is composed: Clean is a single centered or aligned block, no outline. Bold caps is the classic meme layout - all-caps text with a black stroke outline, headline at the top and subtext at the bottom. Minimal uses smaller text with a wider margin, for a calmer, quote-style look. Alignment (left, center, right) applies within whichever style you've picked, and on an Arabic or other right-to-left headline, "left" and "right" swap automatically so the alignment still reads correctly against the text's own direction. This guide covers which style actually fits which kind of post.

Step 4 - pick a size and download

The size list reuses the exact same platform preset table as the social media image resizer tool, grouped by Instagram, Facebook and X. Once the card looks right, click Download - it exports as a PNG if you're using a photo background (so the overlay stays clean) or a JPG for solid and gradient backgrounds. Nothing about downloading changes the live preview, so it's safe to keep adjusting text or colors and download again as many times as you want.

Changing your mind about the background photo

An unsupported or unreadable photo gets a plain warning rather than breaking the tool, and switching straight back to Solid or Gradient - or trying a different photo - works immediately, no reload needed. A bad background photo never blocks you from finishing the card some other way.

If your text is long

The card shrinks the text automatically to keep it inside the frame as you type more. Past a certain point it stops shrinking further rather than becoming too small to read, and a note appears suggesting shorter text instead - a disclosed tradeoff, not silently unreadable output.

Typing in Arabic or another right-to-left language

The card draws text in the correct direction based on what you actually typed, independent of which direction the site itself is laid out in - so an Arabic headline shapes and joins correctly whether you're browsing the English version of the site or the Arabic one.

Making a second version of the same card

Because the whole thing is one live canvas with no saved project file, there's no "open the last card again" step - if you want a second version with a different size or background, the fastest route is simply changing the option you want to change and downloading again, right there in the same session. Nothing about a previous download locks in any of your choices.

For why a card like this is worth making instead of a screenshot in the first place, see the background. Or start typing and watch the preview update.