Nazwany kolor · #D43728
Steelhead Redd
Steelhead Redd to #D43728: rgb(212 55 40), hsl(5 68% 49%), oklch(0.576 0.196 29.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Steelhead Redd color name →
#D43728
oklch(0.576 0.196 29.7)
Konwersje koloru
- HEX
- #d43728
- RGB
- rgb(212 55 40)
- HSL
- hsl(5 68% 49%)
- HWB
- hwb(5 16% 17%)
- OKLCH
- oklch(0.576 0.196 29.7)
- OKLab
- oklab(0.576 0.17 0.097)
- CIE Lab
- lab(48.9 60.86 47.13)
- LCH
- lch(48.9 76.97 37.8)
- CMYK
- cmyk(0% 74% 81% 17%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- DB5140
- E26756
- E87B6B
- ED8F80
- F2A295
- F6B5AA
- FAC7BF
- FCDAD4
- FEECE9
Odcienie ciemniejsze
- B82E21
- 9D261B
- 831E15
- 69160F
- 510F09
- 3A0804
- 240302
- 100101
- 020000
Tony
- CD4434
- C64E3F
- BF5748
- B75E51
- AF655A
- A76B62
- 9E7169
- 957671
- 8B7B79
Harmonie kolorów
Komplementarna +180°
- D43728
Steelhead Redd
- 008999
≈ Atlantic Blue
Analogowa -30° +30°
- D43728
Steelhead Redd
- CD3375
≈ Magentarama
- B16200
≈ Orange Brown
Triada +120° +240°
- D43728
Steelhead Redd
- 009241
≈ Viper Green
- 4E6AEB
≈ Flickering Sea
Komplementarna rozszczepiona +150° +210°
- D43728
Steelhead Redd
- 008D7B
≈ Greenlake
- 0081BE
≈ Phuket Palette
Tetrada +90° +180° +270°
- D43728
Steelhead Redd
- 708400
≈ Swamp Green
- 008999
≈ Atlantic Blue
- 8D54D9
≈ Gloomy Purple
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.79:1 · APCA Lc 72
Ag
FailNa czerni
WCAG 4.37:1 · APCA Lc 30
Najlepszy kolor tekstu: #FFFFFF
WCAG 4.79:1 (AA) · APCA Lc 72
Contrast pairs
Fragmenty kodu
CSS
:root {
--steelhead-redd: #d43728;
--steelhead-redd-rgb: 212 55 40;
--steelhead-redd-oklch: oklch(0.576 0.196 29.7);
}
.element {
color: var(--steelhead-redd);
background-color: hsl(5 68% 49%);
border-color: oklch(0.576 0.196 29.7);
}Tailwind CSS v4
@theme {
--color-steelhead-redd: #d43728;
--color-steelhead-redd-50: #ffe1d3;
--color-steelhead-redd-100: #ffd0bf;
--color-steelhead-redd-200: #ffb49f;
--color-steelhead-redd-300: #ff8e76;
--color-steelhead-redd-400: #fd6754;
--color-steelhead-redd-500: #ec3a2a;
--color-steelhead-redd-600: #c73426;
--color-steelhead-redd-700: #a02a1e;
--color-steelhead-redd-800: #781c17;
--color-steelhead-redd-900: #55120f;
--color-steelhead-redd-950: #380303;
}SCSS
$steelhead-redd: #d43728;
$steelhead-redd-rgb: 212, 55, 40;
$steelhead-redd-light: mix(#fff, $steelhead-redd, 20%);
$steelhead-redd-dark: mix(#000, $steelhead-redd, 20%);
.element {
color: $steelhead-redd;
box-shadow: 0 0 0 2px rgba($steelhead-redd, 0.35);
}