HSL vers HEX: #7B3306
Aussi appelée: Tailwind amber-900
Résultat
hsl(23.08 90.70% 25.29%) → #7B3306
Les valeurs sont données en pleine précision : reconvertir donne exactement #7b3306. La forme arrondie est celle que l’on colle d’habitude dans le CSS.
Calcul pas à pas
Chaque nombre est calculé à partir de l’entrée, rien n’est cherché dans une table.
1. input
H = 23.08°, S = 90.70%, L = 25.29%
2. C
C = (1 − |2L − 1|) × S = 0.45876
3. X
X = C × (1 − |(H / 60°) mod 2 − 1|) = 0.17647 (H / 60° = 0.3847, sector 0)
4. m
m = L − C / 2 = 0.02352
5. (R′, G′, B′) + m
(R′, G′, B′) = (0.45876, 0.17647, 0.00000) R = round((0.45876 + 0.02352) × 255) = 123 G = round((0.17647 + 0.02352) × 255) = 51 B = round((0.00000 + 0.02352) × 255) = 6
6. RGB → HEX
#7B3306
Tous les formats
- HEX
- #7b3306
- RGB
- rgb(123 51 6)
- RGB (legacy)
- rgb(123, 51, 6)
- HSL
- hsl(23.08 90.70% 25.29%) → hsl(23 91% 25%)
- HWB
- hwb(23 2% 52%)
- OKLCH
- oklch(0.415 0.113 45.9) · oklch(41.5% 0.113 45.9)
- OKLab
- oklab(0.415 0.078 0.081)
- Lab (D50)
- lab(31.33 30.43 40.29)
- LCH (D50)
- lch(31.33 50.49 52.93)
- Display P3
- color(display-p3 0.4477 0.2168 0.0819)
- Linear sRGB
- color(srgb-linear 0.1981 0.0331 0.0018)
Gamut : sRGB et Display P3
#7B3306 est une couleur hexadécimale : elle est donc dans sRGB et, par conséquent, dans Display P3. À cette luminosité et cette teinte, sRGB atteint une chroma de 0.117 et Display P3 de 0.133 ; cette couleur utilise 96 % de la chroma sRGB disponible.
Extraits CSS
.element {
color: #7b3306;
color: rgb(123 51 6);
color: hsl(23 91% 25%);
color: oklch(0.415 0.113 45.9);
}
/* Tailwind CSS v4 */
@theme {
--color-brand: oklch(0.415 0.113 45.9);
}
/* arbitrary values */
class="text-[#7b3306] bg-[oklch(0.415_0.113_45.9)]"
/* wide-gamut screens */
@media (color-gamut: p3) {
.element { color: color(display-p3 0.4477 0.2168 0.0819); }
}
/* relative color syntax: 10% darker */
.element-dark { color: oklch(from #7b3306 calc(l - 0.1) c h); }Couleurs proches
Couleurs les plus proches dans les palettes Tailwind et CSS (distance OKLab).
- v3 amber-900#78350F
- v3 orange-900#7C2D12
- orange-900#7E2A0C
- yellow-900#733E0A
- v3 yellow-900#713F12
- v3 red-900#7F1D1D
- red-900#82181A
- saddlebrown#8B4513
Plus clair et plus foncé, même teinte et même chroma
- #8E441D · oklch(0.475 0.113 45.9) · ΔL +0.06
- #682200 · oklch(0.355 0.113 45.9) · ΔL −0.06