enyancc / vscode-ext-color-highlight

Extension adds colored border around css/web colors in the editor
GNU General Public License v3.0
263 stars 85 forks source link

Feature/add oklch and var syntax #198

Closed chadgauth closed 8 months ago

chadgauth commented 11 months ago

Description:

I've added support for LCH and OKLCH color models in this project. This came out of my own need to make working with color variables, especially in Tailwind and shadcn/ui, a bit more manageable and intuitive.

Why This Matters:

Handling color variables was starting to drive me a bit nuts. LCH and OKLCH are great for more naturally defining colors, and I figured it would make our lives easier.

What I Did:

--color-variable-oklch: 1 .3 23; translates to oklch(1, .3, 23) in CSS.

The variable must specify it's type at the end to render the color correctly

Tested it out, works like a charm for lch/oklch. I think you'll find it pretty straightforward.