Chinese Traditional Colours

Features

• 161 traditional Chinese colours in nine families: red, yellow, green, blue, pale and muted, washed out, grey and white, black, gold and silver
• Hex, RGB and HSL for every colour, each ready to paste into a stylesheet
• A swatch drawn on the result row, so you never have to convert a code in your head
• Search by name to get every value for one colour
• Reverse lookup: paste a value such as #9d2933 and it names the colour
• Search by alternative names — several different names point at the same colour
• Partial matching: a single character lists every name containing it
• Each colour states whether black or white text reads better, with the WCAG contrast ratio and whether it reaches AA
• All 161 names sit in one searchable dropdown, browsable family by family when the name escapes you
• Empty input shows the whole palette as a reference chart
• Paste tolerance: quotation marks and full-width punctuation around a name do not break the lookup
• Values copy row by row, for dropping into a design file or code

How to use

1. Type a colour name, or open the dropdown and browse by family if the name escapes you
2. Or paste a value such as #9d2933 to find out which colour it is
3. The result gives the swatch, hex, RGB, HSL, family, alternative names, and which text colour reads better
4. Leave the box empty to list all 161 colours, grouped by family

FAQ

Why do different sites give different values for the same name?

Because these names were never codes. They are descriptions — one of them describes the colour of the sky just after rain, and everyone pictures a slightly different sky. The mapping from name to value is a modern editorial convention, and different colour charts disagree by several steps, especially in the paler, greyer families. So treat these as a widely used digital approximation: good enough to recognise a colour, name one, or find inspiration, but not a standard to match against for print or production. For anything that gets manufactured, use a physical colour chart.

Where does this data come from?

The names, values and family groupings come from the open-source project zerosoul/chinese-colors (MIT licensed) and its `colors.json`. We took only three pieces of factual data — name, value, family — plus the alternative names the dataset states explicitly. We did not take its descriptions: those mix in the author’s personal opinions about print ink mixes, which are neither something to show users nor something we want to stand behind. Alternative names are limited to genuine second names for the same colour; plant names and pigment names are excluded, so that searching a herb does not land you on a colour.

How is the "black or white text" figure worked out?

By computing the WCAG 2.1 contrast ratio of the colour against pure black and pure white, taking whichever is higher, and stating whether it reaches the AA threshold of 4.5:1. Note that this uses the WCAG relative-luminance formula (sRGB linearisation, then a weighted sum), not the `r*0.299+g*0.587+b*0.114` perceived-brightness shortcut, which is noticeably over-optimistic on dark and mid-tone colours — and this is the number you are using to pick a text colour. Mid-tones are exactly where the two options are close and where guessing goes wrong.

Can I search by an English colour name?

Not here. These are the Chinese names of 161 traditional colours, and they have no settled English translations. Rendering one as "sky blue" would collapse the distinctions between several of them — and those distinctions are precisely what you are searching for. So on the English page the names stay in Chinese while the labels and explanations are translated. To search by an English colour name, use the colour conversion tool instead.

Why did one character return so many colours?

Because the names are built around shared characters — several different reds each carry the character for red, and they belong to different families, so they all match. Partial matching lists all of them, which beats guessing. To pin down one colour, type its full name; to browse by family, leave the box empty.