Design Editor

When you need a social post, a link-preview banner, or a video thumbnail and don't want to open a heavy design app, this editor gets you to a finished PNG in a couple of minutes. You pick a canvas, drop a solid background behind it, stack text and image layers on top, nudge them into place with sliders, and export. It all runs in your browser — nothing about your design is uploaded.

Pick a canvas that matches where it's going

The three presets aren't arbitrary — each maps to a real slot:

• 1080 × 1080 — a square, the native size for an Instagram feed post.
• 1200 × 630 — the standard Open Graph / social share image, the size Facebook, LinkedIn, and X use when your link is pasted into a post.
• 800 × 600 — a plain 4:3 rectangle for a slide, a blog header, or a quick thumbnail.

Start from the right size and you avoid awkward cropping later. Then set a background color with the color picker; it fills the whole canvas as a solid base.

Layers: text and images

Add as many layers as you like, and each stacks on top of the ones before it.

• Text layers take multi-line content (press Enter for a second line), a font from the family list, a color, and a size from 12 up to 240 px. Text is drawn bold and centered on its anchor point.
• Image layers let you drop in a logo or photo, scaled from 5% to 150% of the canvas width, with an opacity slider from 0 to 100% — handy for a faint watermark or a background photo you want text to sit over.

Every layer has X and Y position sliders that run 0–100% across the canvas. They snap to the center as you drag past the middle, so getting something perfectly centered is easy — just slide until it clicks to 50. To restack, delete a layer with the ✕ and re-add it; layers render in the order they appear in the panel.

How to build a clean graphic

1. Set the canvas and background first, before adding content, so you're composing against the final proportions.
2. Add your text. For a headline-over-color look, one large text layer centered at 50/50 is often all you need. Add a second, smaller layer for a subtitle and drop its Y to around 60.
3. Layer in an image if you want a logo or photo, then use opacity to push it back behind the text.
4. Export PNG to download the result as design.png.

Tips and limits

• Contrast is everything at a glance. Light text on a dark background (or vice versa) reads far better in a crowded feed than mid-tone on mid-tone. The default is white text on indigo for exactly this reason.
• Watch text against images. There's no automatic outline or shadow behind text, so over a busy photo a caption can vanish. Darken the image with a low-opacity black image layer, or keep text over the solid background area.
• It's deliberately minimal. There are no gradients, shapes, or curved-corner boxes — just background, text, and images. For a caption straight onto an existing photo, Text Overlay is quicker; for a full app-icon set, use the App Icon Generator. Everything here renders on your device's canvas and the export never leaves your browser.