Color Picker & Palette
Pick a color, get every format, and generate tints, shades and palettes.
Color Picker & Palette
The color picker lets you choose a color and instantly get it in every common format, then generates matching tints, shades, and palettes around it. Pick visually or type in a value, and the tool shows you HEX, RGB, and HSL representations side by side. It is a quick way to lock in a base color and explore the variations you need for backgrounds, borders, hover states, and full palettes.
How it works
The picker runs entirely in your browser. When you select or enter a color, it converts the value into each supported format and mathematically derives lighter tints and darker shades, plus a coordinated palette, all on your device. Every value copies with one click. Because there is no server involved, results are instant, the tool works offline after loading, and it runs the same on desktop and mobile.
How to use it
- Pick a color with the picker or paste a HEX, RGB, or HSL value.
- Read the color in every format at once.
- Browse the generated tints, shades, and palette.
- Copy any value straight into your CSS or design tool.
Working with color? Convert formats with the Color Converter, verify legibility with the Color Contrast Checker, or blend colors in the CSS Gradient Generator.
Private by design
Your colors and palettes stay in your browser and are never uploaded. The tool is free, needs no account, and runs entirely client-side.
Frequently asked questions
It displays your chosen color in HEX, RGB, and HSL at the same time, and each format can be copied with a single click.
Related tools
Box Shadow Generator
Design CSS box-shadows visually and copy the exact code.
CSS Gradient Generator
Build linear and radial CSS gradients with a live preview.
Color Contrast Checker
Check text/background contrast against WCAG AA and AAA standards.
Meta Tag Generator
Generate SEO, Open Graph and Twitter meta tags from a simple form.