Average color of a list

When a brand kit, a chart series, or a design-token file hands you a pile of hex swatches, you often need one colour that stands for the whole set: a folder thumbnail, a palette-average chip, a default fill, or a sanity check that a new token did not pull the group toward a surprise hue. This average-color-of-list calculator takes a list of hex colours and returns the arithmetic mean of their red, green, and blue channels, rounded to whole 0–255 steps, plus a six-digit hex token you can paste into CSS. The path is deterministic: the same list always yields the same hex.

How the RGB mean of a colour list is computed

Send a list of hex colours. Each swatch is expanded to three integer channels in the zero-to-two-hundred-fifty-five range. Three-digit shorthand such as hash f zero zero doubles each nibble, so hash f zero zero and hash FF0000 are the same pure red.

An optional leading hash is stripped before validation; a 0x prefix is rejected so a packed integer is never mistaken for a colour token. After every swatch parses, the solver adds the red values, the green values, and the blue values, then divides each sum by the count of colours. That quotient is the arithmetic mean of that channel.

Each mean is rounded to the nearest integer with the language half-up rule for positive numbers, so one hundred twenty-seven point five becomes one hundred twenty-eight, and the result is clamped to the legal 0–255 band. The three integers become the result hex as six uppercase digits with a leading hash. Linear RGB mean is not a perceptual midpoint in LAB or HSL: a neon yellow and a near-black navy can pull the average toward the brighter parent because channel space is not uniform.

That is the documented contract of this product, and it is the same mean designers already compute in spreadsheets and theme scripts. A single colour is a legal list and returns itself after normalization. Two copies of the same hex still return that hex.

Pure red, pure green, and pure blue together average to a mid grey, because each channel sums to two hundred fifty-five over three samples.

When one color must stand for a whole set

Design systems collapse a brand palette into one chip for a folder, a Figma component thumbnail, or a marketing tile that must represent many tokens at once. Chart libraries pick a default series colour from the set of already-used strokes so a new line does not clash by accident. Continuous-integration jobs hash the returned hex and fail the build when a token change shifts the palette average more than a review allows.

This landing is the dedicated average color of a list tool: it is not color.mix, which blends exactly two hexes at a chosen ratio, and it is not an image dominant-colour extractor that reads pixels from a photograph. Prefer it when the search intent is summarize these swatches, not mix two, not convert formats, and not pull colours from a bitmap.

Keep the list at or below two hundred fifty-six swatches, pin hex and rgb in tests, and you get a reproducible summary colour for tickets, LMS plugins, and edge workers without standing up a colour-management library of your own.