About hex ↔ hsl / cmyk
HEX, HSL and CMYK describe colour for different jobs. HEX and HSL are for screens, while CMYK is for printing with cyan, magenta, yellow and black ink.
When to use which
- HEX: the standard way to give a colour in web code.
- HSL: handy when you want to make a colour lighter, darker or less intense by changing one number.
- CMYK: values for print shops and desktop publishing.
Screen to print
Screens can show brighter colours than ink can print, so a vivid blue on screen will look duller on paper. The CMYK result here is a simple mathematical conversion. For exact print colour, ask your printer for their colour profile and a proof.
A worked example
The colour #2449B8 is hsl(225, 67%, 43%). To make a hover colour, lower the lightness to 35% and you get a darker blue with the same hue and saturation. In CMYK the same colour is roughly 80% cyan, 60% magenta, 0% yellow and 28% black, which a printer would mix from inks.
Keep print and screen apart
A colour that is bright on screen may print duller, because inks cannot reproduce every glowing screen colour. If a colour must match exactly in print, ask your printer for a Pantone reference or a proof.
