Hex to Pantone Converter
Paste a hex code from your CSS or design file and find the nearest Pantone spot colour — the quickest way to take a web colour into a print conversation.
Pantone
Pantone HEX
What does a hex to Pantone converter do?
A hex code like #0070DC is just RGB written in base-16 — two hex digits each for red, green and blue. So converting hex to Pantone is the same problem as RGB to Pantone: there's no formula linking the two systems, only a search for the closest entry in Pantone's fixed library of spot inks. This tool decodes your hex into channels and returns the nearest available PMS colour.
Hex is the native language of CSS and most design handoffs, which is exactly why this matters. Brand colours are usually documented as hex, but the printer, the embroiderer, and the signage shop all speak Pantone. This converter is the translation step in between.
As with every screen-to-ink conversion, the answer is an approximation. The whole process runs in your browser — paste freely, nothing is transmitted.
How to convert a hex code to Pantone
- 1
Paste your hex code
Enter a value like #0070DC. Both shorthand (#07d) and full six-digit hex are accepted.
- 2
See the closest Pantone
The tool finds the nearest spot colour in the library and shows it next to a preview of your input.
- 3
Copy the code
Copy the Pantone number for your brand guidelines, print file, or vendor email.
- 4
Check it physically
Before production, confirm the suggested code against a real Pantone chip under proper lighting.
Why convert hex to Pantone
Web palette to print
Your site's CSS hex values can be carried over to printed collateral with a sensible Pantone starting point.
Single source of truth
Pin a brand hex to a PMS number so digital and physical media reference the same intended colour.
Faster vendor handoffs
A merch or packaging supplier can quote against a Pantone code far more reliably than against a hex screenshot.
Private by default
The match is computed locally, so pre-launch brand colours never touch a network.
Worked example
A web-style blue hex mapped to its nearest Pantone spot colour.
#0070DCPantone 2186 C (closest match)The decoder reads #0070DC as rgb(0, 112, 220) and returns the nearest library entry. Confirm against a physical chip before committing it to print.
Hex and Pantone aren't two spellings of the same colour
It's tempting to think a hex code 'is' a Pantone colour written differently, but they belong to separate worlds. Hex encodes light intensities for a screen; Pantone names a specific physical ink. The converter finds the spot colour that lands closest to your hex in colour space, and 'closest' can still be visibly off — particularly for saturated hues a screen can show but ink cannot fully reproduce.
There's also no one-to-one mapping: a band of nearby hex codes can all collapse to the same nearest Pantone number, and the reverse value Pantone publishes for that number won't be your original hex. So a hex → Pantone → hex round trip will not return where you started.
Getting a dependable print colour from a hex value
- Decide on coated vs uncoated up front — pick the Pantone suffix (C or U) that matches your stock.
- Use the converter's number to order a printed Pantone chip, then judge the colour on paper, not on screen.
- Compare under standardised D50 lighting; office and daylight bulbs shift how the ink reads.
- For anything load-bearing to the brand, ask your printer for a wet proof before the full run.
Frequently asked questions
No. Many hex codes map to the same nearest Pantone number, and the published value for that Pantone is its own — so converting back yields a different hex, not your original.
Yes. Three-digit shorthand is expanded to its six-digit form before the lookup, so #07d and #0077dd resolve the same way.
Pantone is a finite library of physical inks, while hex can describe over 16 million screen colours. Most have no exact ink, so the tool returns the closest one available.
Coated (C) is for glossy paper and looks more saturated; uncoated (U) is for matte stock and reads softer. Choose the one matching your print job.
Only as a rough hue guide. An uncalibrated screen can misrepresent the colour, so verify critical matches against a physical swatch.
Use the hex this converter gives you as the value of a custom property in :root {}, for example --color-brand-blue: #0070DC. Reference that variable anywhere in your stylesheet instead of hardcoding the hex, so a future brand update only needs one change.
Need another tool?
Browse the full toolbox or dig into the blog for the engineering behind it.