CMYK ↔ RGB ↔ HEX Color Converter
About Color Naming Tool
The Color Naming & Semantic Identifier finds the closest official human-readable name, Pantone approximation, and semantic design token label for any Hex, RGB, or HSL color using standard color dictionaries (NTC, HTML5, XKCD, Resene).
How to Use Color Naming Tool
Step 1
Enter or paste any Hex, RGB, or HSL color.
Step 2
Review the closest human-readable name, color family, and matching percentage.
Step 3
Click "Copy Name".
Practical Use Cases for Color Naming Tool
Naming Design Tokens in Tailwind & Figma
Generate semantic, memorable token names (e.g. "Royal Blue", "Crimson Ember", "Slate Gray") from raw hex codes for design system style guides.
Identifying Unknown Hex Colors from Screenshots
Look up the exact name and color family of any color picked from an image or website.
Input & Output Examples
Naming Hex `#3b82f6`
`#3b82f6`
Name: "Dodger Blue" | Family: Blue | Closest CSS Name: `dodgerblue` (`#1e90ff`) | Exact Match: `97.8%`
Key Features & Performance
- ✓Comprehensive dictionary of 30,000+ curated color names (NTC, XKCD, Crayola, HTML5 standards).
- ✓Calculates Euclidean $\Delta E$ perceptual color distance to find closest match.
- ✓Categorizes by parent color family (Red, Blue, Green, Earth, Pastel, Neutral).
- ✓100% Client-Side memory execution.
- ✓1-Click Copy color name or CSS variable.
Key Terminology & Definitions
Delta E ($\Delta E$)
A metric for understanding how the human eye perceives color difference; $\Delta E < 1.0$ is imperceptible to most human observers.
Named CSS Colors
The 140 standard named color keywords recognized by all modern web browsers (e.g. `rebeccapurple`, `crimson`, `cornflowerblue`).
