HEX naar RGB: #F4A460
Ook bekend als: CSS sandybrown
Resultaat
#F4A460 → rgb(244 164 96)
Waarden staan op volle precisie, dus terugrekenen geeft exact #f4a460. De afgeronde vorm plak je gewoonlijk in CSS.
Stap-voor-stap berekening
Elk getal wordt uit de invoer berekend, er wordt niets opgezocht.
1. HEX → pairs
#F4A460 → F4 | A4 | 60
2. base 16 → base 10
R = F4₁₆ = 15×16 + 4 = 244 G = A4₁₆ = 10×16 + 4 = 164 B = 60₁₆ = 6×16 + 0 = 96
3. RGB
rgb(244 164 96)
Alle formaten
- HEX
- #f4a460
- RGB
- rgb(244 164 96)
- RGB (legacy)
- rgb(244, 164, 96)
- HSL
- hsl(27.57 87.06% 66.67%) → hsl(28 87% 67%)
- HWB
- hwb(28 38% 4%)
- OKLCH
- oklch(0.784 0.127 59.7) · oklch(78.4% 0.127 59.7)
- OKLab
- oklab(0.784 0.064 0.110)
- Lab (D50)
- lab(74.48 25.72 47.38)
- LCH (D50)
- lch(74.48 53.91 61.50)
- Display P3
- color(display-p3 0.9113 0.6568 0.4220)
- Linear sRGB
- color(srgb-linear 0.9047 0.3712 0.1170)
Gamut: sRGB en Display P3
#F4A460 is een hexkleur en ligt dus binnen sRGB en daarmee binnen Display P3. Bij deze helderheid en tint haalt sRGB een chroma van 0.153 en Display P3 van 0.193; deze kleur gebruikt 83% van de beschikbare sRGB-chroma.
CSS-snippets
.element {
color: #f4a460;
color: rgb(244 164 96);
color: hsl(28 87% 67%);
color: oklch(0.784 0.127 59.7);
}
/* Tailwind CSS v4 */
@theme {
--color-brand: oklch(0.784 0.127 59.7);
}
/* arbitrary values */
class="text-[#f4a460] bg-[oklch(0.784_0.127_59.7)]"
/* wide-gamut screens */
@media (color-gamut: p3) {
.element { color: color(display-p3 0.9113 0.6568 0.4220); }
}
/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #f4a460 calc(l - 0.1) c h); }Kleuren in de buurt
Dichtstbijzijnde kleuren in de Tailwind- en CSS-paletten (OKLab-afstand).
- lightsalmon#FFA07A
- v3 orange-400#FB923C
- v3 amber-500#F59E0B
- amber-500#FE9A00
- orange-300#FFB86A
- orange#FFA500
- v3 orange-300#FDBA74
- darksalmon#E9967A
Lichter en donkerder, dezelfde tint en chroma
- #FFB773 · oklch(0.844 0.127 59.7) · ΔL +0.06
- #E0914D · oklch(0.724 0.127 59.7) · ΔL −0.06