wyreup
inspect

Color Converter

Convert a color string to hex, RGB, HSL, Oklch, and Oklab formats.

Loading…

About Color Converter

Color Converter takes any color string you type and returns it in hex, RGB, HSL, Oklch, and Oklab all at once. Paste a value from a design file, CSS rule, or screenshot eyedropper and read across the formats your stack actually uses. It runs entirely in your browser, so the color you paste never leaves your machine.

Category
inspect
Input
Accepts: text/plain.
Output
Outputs: application/json.
Cost
Free, runs in your browser
Memory
low
Privacy: Color Converter runs entirely on your device. Files you provide never leave your browser — no uploads, no server, no tracking. The page works offline once loaded.

Common uses

  • Turn a designer's hex like #3B82F6 into the rgb() and hsl() values your legacy CSS expects
  • Get the Oklch equivalent of a brand color so you can build a perceptually even tint scale in modern CSS
  • Convert an HSL value from a Sketch or Figma swatch into the exact hex a client asked for
  • Check whether two colors written in different formats (one hex, one rgb) are actually the same value
  • Move a palette toward Oklab to reason about lightness and contrast without RGB's gamma surprises
  • Sanity-check a CSS variable by pasting its computed value and seeing every representation side by side

Frequently asked questions

What color formats can I paste in?

Any common CSS color string works as input: hex (3, 4, 6, or 8 digit), rgb()/rgba(), hsl()/hsla(), and named colors. The output always covers hex, RGB, HSL, Oklch, and Oklab.

What are Oklch and Oklab, and why include them?

They're modern perceptual color spaces now supported in CSS. Unlike HSL, equal numeric steps in Oklch/Oklab look like equal visual steps, which makes them better for building accessible tint and shade scales.

Does this upload my color or design file?

No. There's no file involved and nothing is sent anywhere. The conversion math runs as JavaScript in your browser tab.

Is the conversion exact or rounded?

Values are computed precisely and then displayed at a sensible precision. Round-tripping through gamma and wide-gamut spaces can introduce tiny differences, which is inherent to color math, not a bug.

Can I convert a whole palette at once?

This tool handles one color string per run. For generating a full scheme from a base color, use Color Harmony instead.

Keywords

  • color
  • colour
  • hex
  • rgb
  • hsl
  • oklch
  • oklab
  • convert

Try next

Color Harmony
create

Once you have a base color in the right format, build complementary and analogous schemes from it.
Color Palette
inspect

Pull dominant colors out of an image, then drop any one into the converter to get every format.
Color Palette
inspect

Extract dominant colors from an image as hex codes.
Image Diff
inspect

Pixel-level diff between two images of the same dimensions.
Image Info
inspect

Extract dimensions, format, and metadata from an image.
PDF Info
inspect

Extract page count and metadata from a PDF.
Hash
inspect

Compute SHA-256, SHA-1, or SHA-512 hashes of files.
JSON Formatter
inspect

Parse and pretty-print JSON with configurable indentation.
Extract PDF Tables
export

Extract tabular data from a PDF as JSON or CSV. Works well for simple tables with aligned columns and no merged cells. Complex tables, rotated text, and scanned PDFs (images) will not extract cleanly.
Topic Keywords
text

Pull the topic-bearing nouns and noun phrases out of any text. Answers "what is this about" — not "what words appear most" (try Text Frequency for that). Runs entirely in your browser.