gizmobench

Pixel Counter

Open an image and this page counts it: the width and height, the total number of pixels, how many of those pixels are not transparent, and how many match a colour you pick, within a tolerance you set from 0 to 255 per channel. Three things make it different from the counters this search turns up. First, every decoded pixel is tested once, so the answer is arithmetic over the whole image rather than a sample of it, and at tolerance 0 only an exact RGB match counts. Second, the match is shown against both denominators and each one is labelled: the readout gives the matched share of all pixels, transparent ones included, and the pane beside the picture gives the share of the non-transparent pixels, which is the number you want when part of the image is cut out. Third, a pixel at alpha 0 is never a match, because there is no visible colour there to match with, so a cut-out PNG does not report a huge count on whatever colour is hiding under its clear area. You also get the mask: one PNG the same size as the image, white where a pixel matched and black everywhere else, ready to drop into an editor as a selection. Nothing is uploaded, there is no account, and the page opens on a built-in sample so you can see exactly what it does before you choose a file of your own.

swatch-sample.png38,400 px

240 x 160 pixels a sample drawn by this page, not a photograph

countsone pass
total pixels        38,400
non-transparent     32,000
matched             14,880
fraction of all     38.75%
of non-transparent   46.5%

mask PNG ready
Total
38,400
Non-transparent
32,000
Matched
14,880
Fraction of all pixels
38.75%

38,400 pixels in all, 32,000 not transparent, 14,880 matching #E05A3C within 12 per channel, which is 38.75% of all pixels.

  • 2 x 2 test imagetwo red, one blue, one clear
    4 total, 3 non-transparent, 2 match #E05A3C
  • Tolerance 0#E05A3C
    only that exact RGB counts
  • Tolerance 12near colours included
    14,880 of 38,400, 38.75% of all

A built-in sample is on screen until you open an image. Open an image, drop one on the stage, or paste a screenshot. Up to 12 megapixels, which is 12,000,000 pixels: the whole picture is held in this browser while it is counted, so that is a memory bound rather than an upload limit. The mask button saves a PNG the same size as the image, white where a pixel matched and black everywhere else.

Two denominators, both on the page, because they answer different questions. Fraction of all pixels divides the matched count by every pixel in the grid, transparent ones included, and that is the number in the readout. The right-hand pane also divides it by the non-transparent pixels, which is the one you want when part of the picture is cut out. A pixel at alpha 0 is never a match: it has no visible colour to match with.

Accuracy. Exact counting: every decoded pixel is tested once, and at tolerance 0 only an exact RGB match is counted. It counts pixels and nothing else, so a count here says nothing about the physical size of what the photograph shows. Images up to 12 megapixels are decoded in your browser and are never uploaded.

Common questions

How do I count how many pixels of one colour an image has?
Open the image, put the colour in the target field as a hex code such as #E05A3C or pick it with the swatch beside that field, and set the tolerance. The Matched cell then counts every pixel whose red, green and blue are all within that tolerance of the target, and the Fraction of all pixels cell gives that count as a share of every pixel in the image. The built-in 2 x 2 test image is the shortest way to see the rule at work: two of its four pixels are the target colour, one is blue and one is fully transparent, so it counts 4 pixels in all, 3 that are not transparent and 2 that match, which is 50% of all pixels.
What does the tolerance actually do?
It is the largest difference allowed on any one channel, measured in the 0 to 255 range a channel is stored in. At 0 a pixel counts only when its red, green and blue are exactly the target's, which is what an exact match means here. At 12 each of the three channels may sit up to 12 steps away, so near colours and the soft edges of a shape are pulled in. At 255 every non-transparent pixel matches, because no two channel values can differ by more than that, and the matched count becomes the same number as the non-transparent count. The comparison is on red, green and blue only: alpha takes no part in it.
Are transparent pixels counted?
They are counted in the total and nowhere else. The total is width times height, the whole grid, because a transparent corner is still part of the image. The non-transparent count takes every pixel with an alpha above 0, so a partly transparent pixel is included and is matched on the red, green and blue the file stores for it. A pixel at alpha 0 never matches, whatever colour sits under it, because it has nothing visible to compare with. That rule is the reason a cut-out PNG does not suddenly report a huge match on the colour its hidden pixels happen to hold.
Why are there two percentages?
Because they answer two different questions and one percentage on its own is easy to misread. Fraction of all pixels divides the matched count by every pixel in the grid, transparent ones included: that is the headline, it sits in the readout, and the label says which denominator it uses. The pane beside the picture also divides by the non-transparent pixels, which is what you want when the image is a cut-out and the clear area would otherwise drag the figure down. On the 2 x 2 test image the same 2 matched pixels read as 50% of all pixels and 66.67% of the non-transparent ones.
Is my image uploaded anywhere?
No. Your browser decodes the file, this page draws it to a canvas of its own and reads the bytes back, and the counting happens in your own tab: there is no server in this, no account to make and no request of any kind. The image is never written to storage either. The only things the page remembers are the target colour, the tolerance and whether you were last looking at the image or at the mask, and the Start over button above the tool forgets those three.
How large an image can it count?
Up to 12 megapixels, which is 12,000,000 pixels: a 4,000 by 3,000 photograph is exactly at that limit and is counted. The whole picture is held in this browser while it is counted, so the ceiling is a memory bound rather than an upload limit, and there is no file size limit, no daily count and nothing to sign up for. A larger image is refused with its own pixel count and the limit both named, rather than quietly resized to fit: resizing invents pixels that were never in the file and would change the answer, which is the one thing a counter must not do.
What is the mask PNG for?
It shows you where the matches are, instead of only how many there were. The file is the same width and height as the image, white wherever a pixel matched and black everywhere else, fully opaque, so an editor will take it as a selection, a channel or a layer mask. It is the quickest way to check that a tolerance is catching what you meant it to catch: a setting that has crept into the background is obvious the moment you look at the mask and invisible in a number.
Which image formats does it read?
Whatever your browser decodes, which in practice is PNG, JPEG, WebP and GIF everywhere and AVIF in the browsers that have added it. The decoding is the browser's work rather than ours, so when one refuses a file the page names the file and the type it would not read and suggests saving a PNG or a JPEG copy, instead of showing a count of nothing. An SVG is refused on purpose: it is drawn from shapes rather than stored as pixels, so it has no pixel grid to count until you export it at a size.
Can it tell me how big something in the photograph is?
No, and it does not try. A count here is a count of pixels, so it says nothing about the real size of what the picture shows: that depends on how far away the camera was and what lens was on it, and none of that is in the pixels. What the count is exact about is the image itself. Every decoded pixel is tested once, at tolerance 0 only an exact RGB match is counted, and the tool tells you the denominator it used so the fraction cannot be read as something it is not.

Exact counting: every decoded pixel is tested once, and at tolerance 0 only an exact RGB match is counted. It counts pixels and nothing else, so a count here says nothing about the physical size of what the photograph shows. Images up to 12 megapixels are decoded in your browser and are never uploaded.