Santekno/tools
CategoriesTutorials

Color Converter

Convert any color between hex, rgb, hsl, and oklch. Optional 5-step palette around the input.

Processed in your browserUpdated · Jan 2026
Input
0 chars
Output
0 chars

How to use Color Converter

Paste your input on the left, choose the options you want, and the output appears instantly on the right. Everything runs in your browser — none of your data is sent to a server.

  • Paste or type your input in the INPUT panel
  • The output regenerates automatically as you type
  • Use Copy to put the result in your clipboard
  • Click Sample to load a working example

What is Color Converter?

Color Converter accepts any CSS-parseable color (hex, rgb(), hsl(), oklch(), or a CSS named color like `rebeccapurple`) and emits every standard representation: hex, rgb(), hsl(), oklch(), plus the relative luminance per WCAG. Optionally include a 5-step LCH palette around the input — useful for generating tint/shade scales for design systems. All conversions run via chroma-js in the browser. This tool is part of santekno's developer toolbox — a curated collection of utilities built for engineers who care about speed, privacy, and simplicity.

Common use cases

  • Debugging API payloads and integration issues
  • Inspecting tokens, hashes, or encoded strings during development
  • Generating fixtures and sample data for tests
  • Sharing readable output with teammates in code reviews

FAQ

A modern perceptual color space (CSS Color Level 4). Equal-step changes in lightness or chroma look equal to the eye — making it superior to HSL for design tokens.