SquareImage

Solid Color Image Generator

Generate a plain black, white, or custom solid colour image at any size. Pick a swatch or type a hex code, choose a preset resolution or your own dimensions, and download a PNG, JPEG or WebP. There is nothing to upload and nothing to install.

1080 x 1080 px · #146C5C

Pick a color

Solid Color Image Generator, at a glance

Solid Color Image Generator on SquareImage.dev creates a black, white, or custom-colour image with nothing to upload. Pick a swatch, use the colour picker or type a hex code, choose 512 x 512, 1080 x 1080, 3000 x 3000, Full HD, portrait, QHD, 4K, or a custom size, and download PNG, JPEG or WebP. It produces flat RGB colour only — no gradients, transparency, text, shapes, or CMYK. It is free, needs no account, and generates the file on the device with Canvas.

By · Verified

What does the solid colour tool do?

It creates an image file that contains one colour and nothing else. That sounds trivial until you need one: most people end up opening a full image editor, making a new document, filling it, and exporting, for a file that takes two clicks here.

What do I need?

A colour and a size. If you are matching a brand, have the hex code to hand; the text field accepts it with or without the leading hash.

How do I download a solid colour background?

  • Choose the colour. Click a swatch, use the colour picker, or type a hex code.
  • Choose the size. Square, Full HD, portrait, QHD, 4K, or custom dimensions.
  • Pick a format and download. The preview is scaled down; the file is full size.

How do I create a black square image?

Choose the black #000000 swatch, then select 512 × 512, 1080 × 1080, 3000 × 3000, or a custom square size. Download PNG when every pixel should remain exactly black; JPEG can introduce tiny compression differences even in a flat image.

How do I create a white square image?

Choose the white #FFFFFF swatch and select the square dimensions you need. A white square can serve as a blank background, placeholder, layout test image, or a base for text and graphics in another editor.

Can I make a 512 × 512 or 3000 × 3000 color image?

Yes. Both are built-in square presets. The 512-pixel option produces a compact canvas for an icon or avatar, while 3000 × 3000 is a large nine-megapixel square. Custom width and height fields cover every other size up to 10,000 pixels per edge.

When do you actually need a solid colour image?

  • A placeholder while a real image is still being shot or licensed.
  • A plain backdrop for a video call, a slide, or a phone wallpaper.
  • A flat base to composite a logo or text onto in another tool.
  • Testing how a layout handles an image of a given aspect ratio.
  • A colour block behind a transparent PNG to check its edges.

What will it not do?

  • Gradients. One flat colour only. A two-stop gradient needs a real editor.
  • Transparency. Every pixel is filled. A fully transparent PNG is not something this generates.
  • Exact print colour. These are RGB files. Print work needs CMYK from a print-aware application, and the on-screen colour will not match the ink.
  • Text or shapes. Composite those on afterwards.

How is this different from the other tools here?

The square image converter also has a solid-colour mode, but there the colour fills the space around a photo. This page produces the colour on its own, at any aspect ratio rather than only 1:1. If you want a whole photo on a coloured square for a profile picture, the Full DP maker is the right one.

Frequently asked questions

Can I create a black or white square image?

Yes. Select the black or white swatch, choose a square preset such as 512 × 512, 1080 × 1080, or 3000 × 3000, and download PNG, JPEG, or WebP.

Which format should I download?

PNG for a flat colour: it is lossless and a single-colour PNG is only a few kilobytes whatever the dimensions. JPEG re-encodes the colour and can leave faint blocking on a saturated hue. WebP is the smallest of the three and fine for the web.

Will the colour match my hex code exactly?

In PNG and WebP, yes. JPEG is lossy, so a strong red or blue can shift by a value or two. If the colour has to be exact for a brand, use PNG.

What is the largest size I can make?

10,000 pixels on either edge. Past that a browser canvas can run out of memory, and a flat colour that large is almost never what you actually need.

Can I make a transparent image instead?

Not here; this generates a filled rectangle. For a transparent area around a picture, use the rounded corners tool and export as PNG.

Does this send anything to a server?

No. There is nothing to upload. The rectangle is drawn on a canvas in your browser and saved from there.

Every tool on this site draws your photo onto an HTML canvas and reads the result back out — that is the whole pipeline, which is why nothing is uploaded and why the export size behaves the way it does. The browser's own documentation describes the drawing step:

“drawImage() will always use the source element's intrinsic size in CSS pixels when drawing, cropping, and/or scaling.”
— MDN Web Docs, CanvasRenderingContext2D: drawImage() method

Sources

Links checked 2026-09-03.