mdn / mdn/browser-compat-data

css.types.color.{oklab,oklch} - Browsers are not spec compliant, support is only partial

Open
#26,838 5 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

browser:multiple data:css info needed
Dominant language
JSON
Stars
5.8k
Forks
2.6k
Avg merge
1d 21h
Merged PRs (30d)
186

Description

What type of issue is this?

Incorrect support data (see below)

What information was incorrect, unhelpful, or incomplete?

The way browsers currently implement OKL* color spaces is not spec compliant and detrimental to accessibility.

The OKLab and OKLch color spaces have been designed with wide gamut and accessibility in mind, but the implementors skipped the accessibility aspects of the spec.

OKL* color spaces let users specify colors that are beyond what current displays are able to render.

In these situations, the spec says that the colors should be mapped using a specific algorithm that preserves the luminance and does its best to approach the saturation and chroma.

With a proper implementation, this lets authors design pages with a contrast between the text and the background that remains the same, no matter what display their users use.

With the current implementation, bad surprises are bound to happen.

https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/oklch is also concerned by this issue.

What browsers does this problem apply to, if applicable?

Chromium (Chrome, Edge 79+, Opera, Samsung Internet), Firefox, Safari

What did you expect to see?

I expect to see the current implementations marked as partially compatible, as they didn't implement OKL*, but a ShittyL* color space that is not accessible, but squats the name of the accessible one.

I expect to see a warning about these accessibility issues that discourages authors from using these color spaces or tells them to thread carefully when using them (staying in the sRGB gamut).

Did you test this? If so, how?

Visit https://vasilis.nl/dingen/bugs/oklch.html

The squares should be white and black per spec, they aren't in any browser.

Can you link to any release notes, bugs, pull requests, or MDN pages related to this?
Do you have anything more you want to share?

This is such a perfect example of systemic discrimination at work.

A system designed to be accessible ends up being implemented with poor accessibility and usability by one big actor, and everyone follows suit because it's easier.

MDN URL

https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/oklab

MDN metadata
MDN page report details
  • Query: css.types.color.oklab
  • Report started: 2025-05-19T17:17:28.100Z

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by comparing the CSS Color specification with the linked CSSWG discussions and browser bug reports, then inspect the OKLab and OKLch compatibility records identified by the query. Verify whether the existing data should be partial and whether an accessibility warning fits the project’s data conventions; done means the records accurately reflect browser behavior and the documented concern.

Written by the indexing model from the issue text.

Assessment

Tech stack
css
Domain
accessibility, documentation
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.