Color Picker
Pick any color visually and copy the value in HEX, RGB, HSL, or OKLCH. Enter a hex code to convert to other formats. Includes a color wheel, shade slider, and clipboard copy.
rgb(99, 102, 241)
hsl(239, 84%, 67%)
How to use the color picker
Pick a color or paste a hex code; HEX, RGB, HSL, and OKLCH update simultaneously.
Formula & explanation
RGB ⇄ HSL via the standard conversions. We display rounded values for legibility.
Examples
#6366f1 = rgb(99, 102, 241) = hsl(238, 84%, 67%).
Frequently asked questions
- What color formats does this show?
- HEX (#RRGGBB), RGB (0–255 per channel), and HSL (hue 0–360°, saturation and lightness as percentages).
- What is the difference between HSL and HSB/HSV?
- HSL and HSB/HSV both use hue and saturation, but their third axis differs: HSL uses lightness (50% = pure color), HSB uses brightness (100% = pure color). Most CSS workflows use HSL.
- Can I paste a color in formats other than hex?
- The text input accepts 6-digit hex codes only. Use the native color wheel to pick any color visually.
- Does this tool store my selected colors?
- No — everything stays in your browser's memory and is gone when you close the tab.
Related developer tools tools
- JSON to XML ConverterConvert JSON objects and arrays to well-formed XML. Maps object keys to elements, array items to repeated elements, with optional root wrapper.
- JSON to YAML ConverterConvert JSON to clean indented YAML for Kubernetes manifests, Docker Compose, CI configs, and Helm charts. Preserves nested structures.
- JSON to CSV ConverterConvert JSON arrays to CSV with automatic header detection from object keys. Handles nested values and arbitrary delimiters.
- YAML to JSON ConverterConvert YAML to JSON for APIs, config files, and pipelines. Supports indented mappings, sequences, scalars, and nested objects.
- YAML to XML ConverterConvert YAML to well-formed XML for legacy integrations. Preserves nested mappings and sequences as nested elements with text values.
- YAML to CSV ConverterConvert YAML arrays of records to CSV. Flattens nested objects with dot-notation column names so spreadsheet tools can read structured YAML data.