HEX, RGB, and HSL for builders
HEX and RGB
HEX #RRGGBB encodes 8-bit channels. RGB(34,197,94) matches #22c55e. Alpha channels belong in 8-digit HEX or rgba().
HSL
Hue is degrees on the color wheel; saturation and lightness are percentages. HSL is convenient for adjusting tints while keeping a hue family.
Design tip
Convert to HSL to lighten a brand color for backgrounds, then re-check contrast.
Limits
Display-referred sRGB is assumed. Print CMYK and wide-gamut HDR need other pipelines.
FAQ
Q: Is HSL perceptual? A: Only roughly; OKLCH is better for uniform steps but CSS support still varies.
Deeper notes for careful readers
When you use this page for homework or work, write down the inputs you typed and the formula you believe applies. Then recompute once by hand or with a second method. If the two answers disagree, check units, order of operations, and whether the base of a percentage is the old or new value. Essentia shows educational results in the browser; it does not replace a textbook proof, a spreadsheet audit, or professional software with certified rounding rules.
Practice checklist
1) State the question in one sentence. 2) Name the formula. 3) Plug in numbers with units. 4) Sanity-check magnitude (too big or too small?). 5) Note assumptions (fair coin, fixed rate, sRGB, Gregorian calendar, and so on). Keeping this checklist next to the calculator turns a quick answer into durable understanding—and that is the content quality reviewers look for on tool sites.
From screen to CSS
Design tokens often store brand colors as HEX and derive hover states in HSL or OKLCH. After lightening a color for backgrounds, re-run contrast checks against text. Print workflows convert to CMYK with profiles Essentia does not apply. Keep a note of whether your pipeline is sRGB or display-P3 when colors look different across devices.