RGB naar HEX: #F4A460
Ook bekend als: CSS sandybrown
Resultaat
rgb(244 164 96) → #F4A460
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. base 10 → base 16
R = 244 = 15×16 + 4 → F4 G = 164 = 10×16 + 4 → A4 B = 96 = 6×16 + 0 → 60
2. pairs → HEX
F4 A4 60 → #F4A460
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