Derek's OKLCH Variables

About this plugin

Derek's OKLCH Variables -Figma OKLCH Token ConversionTransform your color workflow with vibrant, perceptually uniform OKLCH colors!Derek's OKLCH Variables makes it easy to sync OKLCH color tokens between your CSS files and Figma variables. Built with a bold, comic book-inspired interface that makes color management actually fun.✨ Features📥 Import OKLCH VariablesPaste CSS variables in OKLCH format directly into FigmaAutomatically updates existing variables or creates new onesSupports the modern oklch(L C H) CSS formatBatch import hundreds of color tokens at once📤 Export to OKLCH CSSExport Figma color variables back to OKLCH CSS formatChoose specific collections or export everythingOne-click copy to clipboardPerfect for keeping design tokens in sync🎨 Accurate Color ConversionPrecise OKLCH ↔ RGB conversion using OKLab color spacePerceptually uniform color adjustmentsMaintains color accuracy through round-trip conversionsNo more RGB/HSL headaches⚡ Lightning FastOptimized batch operationsUpdates variables in seconds, not minutesSmart collection scoping prevents conflictsHandles large design systems with ease🎯 Perfect ForDesign systems using OKLCH color tokensTeams syncing colors between code and designAnyone working with modern CSS color formatsDesigners who want better color perception💡 How to UseImport:Click the giant IMPORT buttonSelect your target collectionPaste your OKLCH CSS variablesHit IMPORT NOW!Export:1. Click the giant EXPORT button2. Choose a collection3. Click EXPORT NOW!4. Copy to clipboard and you're done📝 Supported Format--colors/blue/100: oklch(0.893 0.052 264.8);--colors/neutral/25: oklch(0.983 0.0076 48.7);Works with any valid OKLCH color format including alpha channels.🎨 Why OKLCH?OKLCH is a perceptually uniform color space that makes color adjustments predictable and consistent. Unlike RGB or HSL, changes in lightness, chroma, and hue feel natural to the human eye.🦸‍♂️ AboutDesigned with love by Delightful Derek, Inc. for designers who appreciate both great tools and great design.License: Your mom.