What are HEX, RGB, and HSL?
- HEX: A hexadecimal color code in the format
#RRGGBB, the most widely used format across the web and design tools. - RGB: Mixes red (R), green (G), and blue (B), each on a scale of 0-255.
- HSL: Expresses color as Hue (0-360Β°), Saturation (%), and Lightness (%), which makes it easy to adjust just the tone while keeping the same base hue.
How is the palette generated?
The tone palette keeps your chosen color's saturation (S) fixed and steps the lightness (L) up and down, producing a range from light to dark tones. Complementary colors are calculated by adding 180Β° to the hue (H), and analogous colors by adding Β±30Β°.
Frequently Asked Questions
What happens when I click a palette color?
Clicking a swatch copies its HEX code to your clipboard.
Can I use these colors directly in my design tool?
Yes. HEX codes can be pasted directly into Figma, Photoshop, CSS, and most other design and development tools.