Named Color to Hex/RGB Lookup
Search and convert CSS named colors to HEX, RGB, and HSL values. Browse 200+ standard CSS color names with visual previews and instant conversion.
Color Results
aliceblue
antiquewhite
aqua
aquamarine
azure
beige
bisque
black
blanchedalmond
blue
blueviolet
brown
burlywood
cadetblue
chartreuse
chocolate
coral
cornflowerblue
cornsilk
crimson
cyan
darkblue
darkcyan
darkgoldenrod
darkgray
darkgreen
darkkhaki
darkmagenta
darkolivegreen
darkorange
darkorchid
darkred
darksalmon
darkseagreen
darkslateblue
darkslategray
darkturquoise
darkviolet
deeppink
deepskyblue
dimgray
dodgerblue
firebrick
floralwhite
forestgreen
fuchsia
gainsboro
ghostwhite
gold
goldenrod
gray
green
greenyellow
honeydew
hotpink
indianred
indigo
ivory
khaki
lavender
lavenderblush
lawngreen
lemonchiffon
lightblue
lightcoral
lightcyan
lightgoldenrodyellow
lightgray
lightgreen
lightpink
lightsalmon
lightseagreen
lightskyblue
lightslategray
lightsteelblue
lightyellow
lime
limegreen
linen
magenta
maroon
mediumaquamarine
mediumblue
mediumorchid
mediumpurple
mediumseagreen
mediumslateblue
mediumspringgreen
mediumturquoise
mediumvioletred
midnightblue
mintcream
mistyrose
moccasin
navajowhite
navy
oldlace
olive
olivedrab
orange
orangered
orchid
palegoldenrod
palegreen
paleturquoise
palevioletred
papayawhip
peachpuff
peru
pink
plum
powderblue
purple
rebeccapurple
red
rosybrown
royalblue
saddlebrown
salmon
sandybrown
seagreen
seashell
sienna
silver
skyblue
slateblue
slategray
snow
springgreen
steelblue
tan
teal
thistle
tomato
turquoise
violet
wheat
white
whitesmoke
yellow
yellowgreen
About Named Color to Hex/RGB Lookup
A Named Color Lookup tool is a comprehensive database of CSS named colors that allows you to search through 200+ standard web color names and instantly convert them to HEX, RGB, and HSL values. This tool provides visual previews of each color and detailed information about all standard CSS color keywords supported by web browsers.
Why use a Named Color to Hex/RGB Lookup?
Using a Named Color Lookup tool simplifies CSS development by providing quick access to readable color names instead of memorizing hex codes or RGB values. Named colors make CSS more maintainable and self-documenting, while this tool ensures you use the correct values and see exactly how each color appears across different formats.
Who is it for?
This tool is perfect for web developers learning CSS color names, frontend developers creating readable stylesheets, CSS beginners who prefer descriptive color names over codes, design system creators establishing color conventions, and anyone who wants to use semantic color names in their web projects for better code readability.
How to use the tool
Search for a specific color name using the search box or browse the full list
Click on any color name to see its visual preview and detailed information
View the color's equivalent values in HEX, RGB, and HSL formats
Copy the color name or converted values for use in your CSS files
Use the named colors directly in your CSS properties (e.g., color: crimson;)
Frequently Asked Questions
How do I find a CSS named colour?
Search by name (e.g. `tomato`, `coral`, `slategray`) and the tool returns the HEX, RGB, and HSL values for that CSS-defined colour. Reverse lookup also works: enter a HEX or RGB value to find the nearest named colour. The tool covers all 148 CSS named colours defined in CSS Color 4 — from `aliceblue` to `yellowgreen`. Useful for design system documentation, recognising CSS legacy colour names in old code, and finding human-readable colour names.
What is a CSS named colour?
CSS includes 148 predefined colour names (HTML 4 added the original 16; CSS 2.1 and Color 4 expanded the list significantly). Each name maps to a specific RGB value: `red` = `#FF0000`, `tomato` = `#FF6347`, `royalblue` = `#4169E1`. The names are case-insensitive and work directly in CSS: `color: tomato;`. The full list includes basic colours, named greys, and many fanciful names (`papayawhip`, `mistyrose`, `peachpuff`). All are exact, lossless equivalents to their RGB values.
Are named colours accurate / exact?
Yes — exactly accurate. Each CSS named colour has a fixed RGB equivalent defined in the CSS specification. `tomato` is always `#FF6347` (`rgb(255, 99, 71)`). No browser variation, no approximation. The reverse lookup (HEX → nearest named colour) finds the closest match by Euclidean distance in RGB space — when no exact match exists, the result is the 'closest' named colour, which may differ slightly from the input.
Can I use named colours directly in CSS?
Yes — write the name in any CSS colour context: `color: tomato;`, `background: papayawhip;`, `border: 1px solid royalblue;`. All modern browsers support all 148 CSS named colours since they've been part of the spec for decades. They work in HTML attributes too (`<font color=red>`, though `<font>` is deprecated). Named colours are most useful for prototyping, code readability, and informally referencing common colours; for design systems, prefer explicit HEX or HSL values.
What's the most common naming convention for CSS colours?
Most names are single English words: `red`, `blue`, `gold`, `pink`. Some are compound: `lightblue`, `darkorange`, `mediumseagreen` — written as one word with no separator (and case-insensitive). Some are evocative: `papayawhip`, `peachpuff`, `lemonchiffon`, `mistyrose`. A few have alternate spellings: `gray` and `grey` are both valid (and equivalent). For browser compatibility, single-word names are safest; the compound and evocative names have been supported since CSS 2.1+ (2011).
Are there 'web safe' colours?
The 'web safe' palette (216 colours that displayed identically on early-2000s 256-colour displays) is largely obsolete in 2026. Modern displays show millions of colours, and CSS named colours plus the full HEX/RGB/HSL ranges work everywhere. The historical 'web safe' palette is sometimes referenced in retro design or accessibility-conscious contexts (high-contrast simple colours), but you should not constrain modern design to it. Use any HEX/RGB/HSL colour your design calls for.
Can I find a name for a custom HEX value?
Reverse lookup finds the closest named colour for any HEX value. For exact matches (e.g. `#FF6347` → `tomato`), you get the canonical name. For non-exact values, you get the nearest match by Euclidean RGB distance — this approximation is useful for design documentation ('our brand colour is similar to coral') but the named colour is rarely an exact match to a custom HEX. For custom colours, define them with explicit HEX in your design tokens; named colours are convenience for prototyping.
What's the difference between named colours and design system colours?
Named colours (`tomato`, `royalblue`) are part of CSS — universally available, but a fixed set unrelated to any specific brand or design language. Design system colours are custom palettes specific to a product (Material Design's `primary`, `secondary`; Tailwind's `blue-500`, `red-900`; brand colours). For design systems, define your colours as custom CSS variables (`--brand-primary: #FF6347;`) and reference them throughout. Named CSS colours are useful for quick prototyping; design systems are the production approach.
Share This Tool
Found this tool helpful? Share it with others who might benefit from it!
💡 Help others discover useful tools! Sharing helps us keep these tools free and accessible to everyone.