Named Color to OKLab Converter

Converted OKLab Output --
100%

Wide-Gamut & Linear Formats

Modern CSS color space notations derived from this color

Contrast Analysis (WCAG 2.1)

Checks the converted color against foreground or background targets for accessibility compliance.

Converting CSS Keywords to OKLab

To convert a named color to OKLab, enter the keyword into the tool above. The converter will map the word to its sRGB values, remove the gamma curve, and process the linear light through LMS cone response matrices to output the final OKLab coordinates.

Preparing Colors for Modern CSS

CSS named colors are legacy values tied to the sRGB color space. If you attempt to create a CSS gradient between two named colors (for example, from blue to white), the browser will default to interpolating the transition in sRGB space. This often results in a muddy, purple-tinted gradient.

By converting your named colors into OKLab, you can force the browser to use modern perceptual math for the transition. OKLab ensures that the hues remain perfectly stable as they blend, resulting in a much smoother, professional-looking gradient.

Related Tools