- From: Manuel Matuzovic via GitHub <sysbot+gh@w3.org>
- Date: Mon, 07 Apr 2025 08:34:36 +0000
- To: public-css-archive@w3.org
Recently I've tried to use `oklch()` and the relative colour syntax to create a super simple colour scale in CSS. I took two colours from an existing website and tried to create a scale from 100% lightness to 0% lightness and the results were very disappointing. Here is an example how an almost white colour looks like with the two colours I picked. This gamut clipping technique that browsers are using makes `oklch()` unreliable and practically unusable. <img width="853" alt="input color oklch(99% .12 182.55)" src="https://github.com/user-attachments/assets/1cd7285b-63f2-4066-8436-fbb2d0806555" /> <img width="850" alt="input color oklch(99% .20 9.96)" src="https://github.com/user-attachments/assets/8d477968-b23f-46d5-af44-35815e441b00" /> https://apps.colorjs.io/gamut-mapping/?color=oklch%2899%25+.12+182.55%29&color=oklch%2899%25+.20+9.96%29 Is there any chance we can get a method that gives us expectable results? Because this clipping technique has real negative impact already. Like I said, I picked existing colours. I didn't deliberatly try to find exceptionally bad examples. -- GitHub Notification of comment by matuzo Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/9449#issuecomment-2782458251 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Monday, 7 April 2025 08:34:37 UTC