What Is a Pixel?

The single coloured square every digital image is built from — what one pixel actually stores, and why you can see them when you zoom in.

Flat vector illustration in teal green of a designer's night studio: a hand with a stylus on a drawing tablet, a warm desk lamp, and a monitor showing a photo corner magnified into a grid of flat coloured squares

A pixel is a single square of colour, and a digital image is a grid of them. The word is short for "picture element" — the smallest piece an image can be broken into. Every photo on your screen is really thousands or millions of these tiny squares laid out in rows and columns, each one holding just one colour. Zoom in far enough on any image and the squares become visible; that's the pixel, laid bare.

What a single pixel stores

One pixel stores one colour, and that colour is normally written as three numbers: how much red, how much green, and how much blue it contains. Each of the three usually runs from 0 to 255, so a pixel with red 255, green 0, blue 0 is pure red, and 0, 0, 0 is black. Mixing the three channels in different amounts is how a pixel can be any one of millions of colours. How many bits each channel gets is a separate topic (see colour depth), but the idea is always the same: a pixel is a spot, and the spot has a colour.

A photograph magnified until one pixel resolves into a single coloured square with red, green and blue values On the left, a small image shown as a grid of coloured squares. A zoom line leads to the right, where one square is enlarged and labelled as a single pixel. Beside it, three bars labelled red, green and blue show the values that make up that pixel's colour. an image is a grid one pixel Red Green Blue
Every pixel is one square holding one colour, and that colour is a mix of red, green and blue.

Why you can see the squares when you zoom in

An image only holds as many pixels as it holds — that count is its resolution. When you enlarge a picture past that point, there are no extra pixels to show, so each existing one is simply drawn bigger, and the grid becomes obvious. The blocky, stair-stepped edges you see on a heavily magnified photo aren't a fault; they're the actual squares the image was always made of, finally big enough to notice.

This is also why you can't rescue detail by enlarging. Blowing a small image up doesn't add pixels that carry real information — software just stretches or guesses at the ones already there, which is why the result looks soft or chunky. The detail has to be captured up front.

Pixels, file size, and resizing

More pixels means more colour values to store, so a higher-pixel image is a larger file. Doubling both the width and the height quadruples the pixel count, which is often the real answer to why an image file is so big — it's holding far more pixels than the place it's displayed will ever show. Bringing the dimensions down to what's needed recomputes the grid at a smaller size, and it's usually the biggest single saving available. Resize Image does exactly that in your browser, with nothing uploaded, and Resize by Percentage scales the whole grid by a factor if you'd rather not type exact numbers.

Device pixels and CSS pixels are not the same

On modern high-density screens, one "pixel" in a web page's layout is often painted by several physical pixels on the display. A phone might pack two or three device pixels into each layout pixel to look sharp. That's why a photo can look crisp on a laptop and slightly soft on a high-resolution phone at the same on-screen size: the phone has more physical pixels to fill and wants a higher-resolution source. When a design asks for an image "at 2x", this is what it means — supply twice the pixels so the dense screen has real detail to draw.

FAQ

Is a pixel a fixed physical size?
No. A pixel has no inherent size in millimetres or inches — it's just a colour sample. How large it appears depends on the screen it's shown on or the setting used to print it, which is the whole point of DPI.

What's the difference between a pixel and resolution?
A pixel is one coloured square. Resolution is how many of them an image contains, written as width by height. One is the unit; the other is the count.

Can I edit a single pixel?
Pixel-level editing exists in image editors, but for everyday jobs you work with the whole grid at once — resizing, cropping, or compressing changes many pixels together rather than one at a time.

← Back to all guides