RGB in HEX: #F4A460
Auch bekannt als: CSS sandybrown
Ergebnis
rgb(244 164 96) → #F4A460
Die Werte stehen in voller Genauigkeit, die Rückrechnung ergibt exakt #f4a460. Die gerundete Form fügst du üblicherweise in CSS ein.
Rechenweg Schritt für Schritt
Jede Zahl wird aus der Eingabe berechnet, nichts ist nachgeschlagen.
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 Formate
- 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 und Display P3
#F4A460 ist eine Hex-Farbe und liegt damit in sRGB und folglich in Display P3. Bei dieser Helligkeit und diesem Farbton erreicht sRGB eine Chroma von 0.153, Display P3 von 0.193; diese Farbe nutzt 83 % der verfügbaren 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); }Ähnliche Farben
Nächste Farben in den Paletten von Tailwind und CSS (OKLab-Abstand).
- lightsalmon#FFA07A
- v3 orange-400#FB923C
- v3 amber-500#F59E0B
- amber-500#FE9A00
- orange-300#FFB86A
- orange#FFA500
- v3 orange-300#FDBA74
- darksalmon#E9967A
Heller und dunkler, gleicher Farbton und gleiche Chroma
- #FFB773 · oklch(0.844 0.127 59.7) · ΔL +0.06
- #E0914D · oklch(0.724 0.127 59.7) · ΔL −0.06