Generate a 1×1 Pixel PNG
Make a single-pixel PNG — transparent or any colour — the smallest valid image, for spacers, beacons and CSS fills.
Free preview · No signup · ~10 seconds
Free downloads are 60% size. Create a free account for the full-resolution, lossless file.
Get the full-quality fileThe account is free. Exporting at full quality uses one credit — packs start at €0.99 for 3, with no subscription.
The smallest useful image there is
About seventy bytes
A one-pixel PNG is close to the smallest valid image a browser will accept. That size is the whole point — it is used in places where an image element must exist but must not cost anything to fetch.
Spacers and stretched fills
The classic use is a transparent spacer forced to a given width and height by the markup. A coloured one stretched with CSS is also the cheapest possible way to paint a solid block without adding a background rule.
Beacons, and the honest caveat
Single-pixel images are what tracking beacons are made of. If that is the use, disclose it — a pixel that reports back without the reader knowing is the thing privacy rules exist about, and it is trivial to detect.
Transparent by default
The default is fully transparent, which is what a spacer needs. Pick a colour if you want a fill, and it comes out as an exact lossless value.
Or inline it
At this size the file is often better inlined as a data URI than served as a request. Generate it here and run it through the image-to-data-URI tool if that is what you need.
Serve it or inline it
Data URI
Inlined in the markup
- No HTTP request at all
- About a third larger as text
- Cannot be cached separately
- Works offline
A pixel used once, in one document
A beacon that has to reach a server
Hosted file
A real request
- Cached across pages
- Roughly seventy bytes
- Costs one round trip
- Server sees the request
Reuse across many pages, or a disclosed beacon
Avoiding a network round trip
How to generate a 1×1 pixel png
Pick a colour
Leave it transparent for a spacer, or choose a fill.
Take the pixel
One pixel, around seventy bytes.
Download
Free preview, or the full-resolution file in the app.
Where a single pixel is the tool
HTML spacers
Force layout spacing where CSS support is unreliable.
Stretched CSS fills
Paint a solid block from the cheapest possible image.
Test fixtures
Use the smallest valid PNG in a test suite.
Disclosed beacons
Build an open-tracking pixel — and tell people it is there.
Or just ask
Describe the edit in your own words
Type what you want changed and the assistant does it on the canvas — each step lands as a layer you can reopen, so nothing it does is baked in.
No edits yet.
Frequently Asked Questions
Related Tools
Guides worth reading
How to Fix Blurry or Fringed Edges on a Transparent PNG
Why your transparent PNG has a white halo, a grey fringe or soft edges — the four real causes, how to tell them apart in seconds, and the fix for each.
SVG vs PNG for Logos: Which File Do You Actually Need?
What SVG and PNG really are, where each one wins, why your developer keeps asking for the SVG, and the three files that cover almost every request.
What to DIY and What to Pay a Designer For
Where design money actually earns its return at pre-seed, where it doesn't, and the honest line between the work worth commissioning and the work worth doing yourself.
Generate a 1×1 pixel
The smallest valid PNG there is.