AK
appkiro.comEnter HSV Values
Input or choose HSV values
See Results
View HSL and other formats
Copy or Use
Copy, save, or reuse your color
Choose a color visually, use sliders, or paste a value.
Quick Presets
hsl(9, 100%, 64%)
tomato
PreviewOriginal
rgb(255, 99, 71)
Lighten 20%
rgb(255, 130, 108)
Darken 20%
rgb(204, 79, 57)
Complementary
rgb(71, 227, 255)
Aa
With White Text
Aa
With Black Text
Other Formats
Color Palette
Did you know?
You can pick a color from your screen in browsers that support the EyeDropper API.
Many colour pickers expose HSV but most CSS workflows prefer HSL because lightness composes well into ramps. This tool keeps the hue identical while recomputing saturation and lightness against the lightness model, ready for hsl() declarations.
HSV and HSL describe the same RGB color but the saturation axis is defined differently, so the saturation percentage will usually change when you cross between them.
Need more notations? Open the Color Converter for HEX, RGB, HSL, LAB, OKLAB, and OKLCH, or use the Color Contrast Checker to validate foreground/background pairs before shipping.
HSV and HSL define saturation differently, so the saturation percentage usually shifts even though the rendered color stays the same.
Yes. Hue is identical across the two spaces; only saturation and the brightness axis are recomputed.
Pick HSL when CSS or design tokens are the destination; pick HSV for picker UIs and shaders that already think in value.