Color Names
A browsable gallery of 4,930 named colors, grouped by family. Open a family, scan the shades, and tap any swatch to copy its hex.
Jump to a family
Tap any swatch to copy its hex code. Nothing leaves your browser — no sign-up, no upload.
Reds 731 colors
Show all 731 reds
Oranges 762 colors
Show all 762 oranges
Yellows 533 colors
Show all 533 yellows
Greens 598 colors
Show all 598 greens
Teals 330 colors
Show all 330 teals
Blues 555 colors
Show all 555 blues
Purples 385 colors
Show all 385 purples
Pinks 271 colors
Show all 271 pinks
Browns 308 colors
Show all 308 browns
Neutrals 457 colors
Show all 457 neutrals
What is the Color Names gallery?
Color Names is a free, browsable gallery of 4,930 named colors, sorted into families you can scan at a glance — reds, oranges, yellows, greens, teals, blues, purples, pinks, browns, and neutrals. Instead of typing a hex code and hoping you guess the right label, you scroll through whole families of color, discover names you never knew existed, and tap any swatch to copy its hex code. It is part reference list, part teaching gallery: a place to find the name of a shade and to learn the vocabulary that designers, painters, and front-end developers use to talk about color. It is the most complete browsable list of color names on the site.
How to use it
- Pick a family from the jump nav (reds, greens, blues, purples, neutrals, and so on), or follow a deep link straight to the greens or blues section.
- Scroll the swatch grid — each swatch shows the color, its common name, and its hex code.
- Tap or click any swatch to copy its hex code to your clipboard, then paste it into your design tool or CSS.
- Read the color-vocabulary section below if you are trying to tell two similar color words apart.
The whole experience is built around one loop: find a shade, copy its hex, get back to work. There is no sign-up, and nothing you do leaves your browser.
How the gallery is organized
Open the family you want and scan every shade by name and hex. Every one of the 4,930 named colors is measured and bucketed into its closest family using the same color engine the rest of this color cluster relies on: it converts each hex into a perceptual color space and assigns a family from the result. So a label like “Tiffany Blue” lands in the blue-green range rather than under some arbitrary heading.
The families you see are reds, oranges, yellows, greens, teals, blues, purples, pinks, browns, and neutrals. Teals are gathered from the cyan and blue-green region; neutrals collect the low-saturation whites, grays, and blacks. Because there is no single global authority for shade names, the same hex can carry more than one common name — we keep the family grouping consistent so you always know roughly where a color lives, even when its label is informal or playful.
The color vocabulary
Color words trip up almost everyone, because many sit right next to each other on the wheel. Here is a plain-English guide to the pairs and trios people mix up most. Each shade below is in the gallery, so you can put the swatches side by side and copy the exact hex you decide on.
Teal vs cyan vs turquoise
All three live in the blue-green region, but they are not interchangeable. Cyan (#00FFFF) is the pure, electric blue-green primary of screens — the brightest and most saturated of the three, and the one you almost never use raw in a design. Teal (#008080) is darker, muted, and grounded; it leans toward navy and reads as serious, professional, almost ink-like. Turquoise (#40E0D0) sits between them: lighter than teal, greener than cyan, with the soft gemstone glow that makes it feel decorative and relaxed. Reach for teal when you want depth and authority, turquoise when you want a breezy accent, and cyan mostly as a building block you tint down from.
Coral vs salmon
Coral and salmon are both warm pink-oranges, which is exactly why they get swapped. Coral (#FF7F50) carries more orange and more punch — it is the livelier, sunnier of the two and pops against cool backgrounds. Salmon (#FA8072) is softer and pinker, with a muted, fleshy warmth that feels calmer and more understated. If a color looks energetic and almost tropical, it is probably coral; if it looks gentle and slightly washed, you are likely looking at salmon.
Violet vs purple vs magenta
These three run along the red-blue edge of the spectrum and shift by how blue, how deep, and how loud they are. Violet (#EE82EE) is a light, soft, reddish-blue that leans clearly toward blue. Purple (#800080) is deeper and sits more centrally between red and blue, giving it that rich, regal weight. Magenta (#FF00FF) is the electric extreme: fully saturated, the loudest red-blue you can make on a screen. The quick rule of thumb — violet leans bluer and quieter, purple is the deep middle, and magenta is the one that shouts.
Maroon vs burgundy vs crimson
All three are dark reds, but their tilt differs. Crimson (#DC143C) is the brightest and most vivid, a strong red with a slight cool edge. Burgundy is a deep wine red with a clear purple undertone, named for the French wine and reading as plush and formal. Maroon (#800000) is the darkest and most brownish of the set, a brooding red that sits close to brown. Look in the reds and browns families to compare them directly.
Examples
- Looking for shades of teal? Open the teals section and scan a full grid of blue-green shades with names and hex codes side by side.
- Need violet’s exact hex for a button? Find violet in the purples family, tap it, and paste #EE82EE into your CSS.
- Unsure whether your accent is coral or salmon? Compare both swatches and pick the name that matches what you see.
Common use cases
- Designers and illustrators hunting for the right shade name, or a whole family of options like “all the greens.”
- Front-end developers grabbing a precise hex for CSS without leaving the browser.
- Writers, crafters, and brand owners learning the correct vocabulary before naming a product, paint, or palette.
- Anyone who landed on “shades of teal,” “violet hex code,” or “teal vs cyan” and wants both an answer and a gallery to explore.
Why use this one
- A browsable gallery grouped by family, not a single search box — you discover names you didn’t know to look for.
- A built-in color-vocabulary guide that the big color-list sites skip.
- Tap-to-copy hex, fully client-side, no account, mobile-friendly, and fast.
FAQ
What is the difference between teal, cyan, and turquoise?
All three sit in the blue-green region, but they are not the same. Cyan is the pure, vivid blue-green primary of screens (#00FFFF) and is the brightest of the three. Teal is a darker, muted, more grounded blue-green (around #008080) that leans toward navy. Turquoise is a lighter, greener, gemstone-inspired shade (around #40E0D0) that sits between the two. Put their swatches side by side in the teals and greens families and copy each hex to compare.
How do I find all the shades of a single color, like teal or green?
Scroll to that color’s family section — every named shade in our 4,930-color library is grouped under its closest family (reds, oranges, yellows, greens, teals, blues, purples, pinks, browns, and neutrals). Open the family you want and you will see every shade with its name and hex code, so “shades of teal” or “shades of green” is just one tap away instead of a search.
What is the hex code for violet, and how is violet different from purple?
Pure web violet is #EE82EE — a light, reddish-blue. Purple is darker and sits closer to the middle of the red-blue range (web purple is #800080), while magenta (#FF00FF) is the brightest, most saturated red-blue. Violet leans bluer and softer, purple is deeper, and magenta is electric. Find each in the purples and pinks families to copy the exact hex you need.
Are these color names official or standardized?
The names come from widely used color-naming datasets that combine the CSS and web named colors with community color lists. There is no single global authority for every shade name, so the same hex can have more than one common name. We group each color by its measured family so you always know roughly where a name lives, even when the label is informal.
Can I copy a color’s hex code from this page?
Yes — tap or click any swatch and its hex code is copied to your clipboard instantly. Everything runs in your browser, with no account and no upload, so you can grab a color and drop it straight into your design tool or CSS.