HEX in RGB: #FF6347
Auch bekannt als: CSS tomato
Ergebnis
#FF6347 → rgb(255 99 71)
Die Werte stehen in voller Genauigkeit, die Rückrechnung ergibt exakt #ff6347. 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. HEX → pairs
#FF6347 → FF | 63 | 47
2. base 16 → base 10
R = FF₁₆ = 15×16 + 15 = 255 G = 63₁₆ = 6×16 + 3 = 99 B = 47₁₆ = 4×16 + 7 = 71
3. RGB
rgb(255 99 71)
Alle Formate
- HEX
- #ff6347
- RGB
- rgb(255 99 71)
- RGB (legacy)
- rgb(255, 99, 71)
- HSL
- hsl(9.13 100.00% 63.92%) → hsl(9 100% 64%)
- HWB
- hwb(9 28% 0%)
- OKLCH
- oklch(0.696 0.196 32.3) · oklch(69.6% 0.196 32.3)
- OKLab
- oklab(0.696 0.165 0.105)
- Lab (D50)
- lab(62.99 59.36 47.88)
- LCH (D50)
- lch(62.99 76.27 38.89)
- Display P3
- color(display-p3 0.9283 0.4286 0.3199)
- Linear sRGB
- color(srgb-linear 1.0000 0.1248 0.0630)
Gamut: sRGB und Display P3
#FF6347 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.196, Display P3 von 0.248; diese Farbe nutzt 100 % der verfügbaren sRGB-Chroma.
CSS-Snippets
.element {
color: #ff6347;
color: rgb(255 99 71);
color: hsl(9 100% 64%);
color: oklch(0.696 0.196 32.3);
}
/* Tailwind CSS v4 */
@theme {
--color-brand: oklch(0.696 0.196 32.3);
}
/* arbitrary values */
class="text-[#ff6347] bg-[oklch(0.696_0.196_32.3)]"
/* wide-gamut screens */
@media (color-gamut: p3) {
.element { color: color(display-p3 0.9283 0.4286 0.3199); }
}
/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #ff6347 calc(l - 0.1) c h); }Ähnliche Farben
Nächste Farben in den Paletten von Tailwind und CSS (OKLab-Abstand).
- red-400#FF6467
- orange-500#FF6900
- v3 red-400#F87171
- orangered#FF4500
- v3 orange-500#F97316
- coral#FF7F50
- orange-600#F54900
- v3 orange-600#EA580C
Heller und dunkler, gleicher Farbton und gleiche Chroma
- #FF775A · oklch(0.756 0.196 32.3) · ΔL +0.06
- #E94F33 · oklch(0.636 0.196 32.3) · ΔL −0.06