Skip to content

fix: use MDN specified OKLCH syntax, remove multiplier and Math.round - #349

Merged
sgoudham merged 1 commit into
catppuccin:mainfrom
IdrisGit:fix-oklch-syntax
Jul 25, 2026
Merged

fix: use MDN specified OKLCH syntax, remove multiplier and Math.round#349
sgoudham merged 1 commit into
catppuccin:mainfrom
IdrisGit:fix-oklch-syntax

Conversation

@IdrisGit

Copy link
Copy Markdown
Contributor

While the official catppuccin/palette generates the correct OKLCH values, the toOklch helper on the website is generating wrong values.

  • Correct OKLCH syntax is oklch(x y z) and not oklch(x,y,z).
  • OKLCH is very sensitive to values specially the Hue value, rounding it can cause color mismatch
  • C (chroma) is not [0,1], it more like [0,0.4] practically and percentages don't just convert 1:1,so browsers will convert x% to (x/100) * 0.4 instead of just (x/100)

Official MDN docs https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/color_value/oklch

… on values.

- Correct OKLCH syntax is `oklch(x y z)`
- OKLCH is very senstive to values specially the Hue value, rounding it
can cause color mistmatch
- C (chroma) is not [0,1], it more like [0,0.4] practically and
percentages don't just convert 1:1,so browsers will convert x% to
(x/100) * 0.4 instead of just (x/100)

@scarcekoi scarcekoi left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The fixed decimal place implementation is correct (instead of rounding), and it now uses the correct format.
Looks good.

@sgoudham sgoudham left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks!

@sgoudham
sgoudham merged commit debc8f8 into catppuccin:main Jul 25, 2026
1 of 2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants