Nazwany kolor · #ED8A53
Toasted Husk
Toasted Husk to #ED8A53: rgb(237 138 83), hsl(21 81% 63%), oklch(0.729 0.14 48.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Toasted Husk color name →
#ED8A53
oklch(0.729 0.14 48.4)
Konwersje koloru
- HEX
- #ed8a53
- RGB
- rgb(237 138 83)
- HSL
- hsl(21 81% 63%)
- HWB
- hwb(21 33% 7%)
- OKLCH
- oklch(0.729 0.14 48.4)
- OKLab
- oklab(0.729 0.093 0.105)
- CIE Lab
- lab(67.71 35.3 45.95)
- LCH
- lch(67.71 57.94 52.5)
- CMYK
- cmyk(0% 42% 65% 7%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F09666
- F3A278
- F5AE89
- F8BA9A
- FAC6AB
- FBD1BC
- FDDDCC
- FEE8DD
- FFF4EE
Odcienie ciemniejsze
- CE7747
- B0653B
- 935330
- 774225
- 5C321B
- 422211
- 2A1408
- 140702
- 030100
Tony
- E28A59
- D8895F
- CD8965
- C28869
- B8876E
- AD8672
- A28576
- 978379
- 8B827D
Harmonie kolorów
Komplementarna +180°
- ED8A53
Toasted Husk
- 15B7EC
≈ Cyanite
Analogowa -30° +30°
- ED8A53
Toasted Husk
- F28085
≈ Meat
- D79B29
≈ New England Autumn
Triada +120° +240°
- ED8A53
Toasted Husk
- 24C397
≈ Macau
- A498F9
≈ Cobalite
Komplementarna rozszczepiona +150° +210°
- ED8A53
Toasted Husk
- 00BEC4
≈ Maximum Blue Green
- 6FA8FE
≈ Fennel Flower
Tetrada +90° +180° +270°
- ED8A53
Toasted Husk
- 79BC63
≈ Leafy Greens
- 15B7EC
≈ Cyanite
- CC89DF
≈ Blush Essence
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.51:1 · APCA Lc 49
Ag
AAANa czerni
WCAG 8.36:1 · APCA Lc 53
Najlepszy kolor tekstu: #000000
WCAG 8.36:1 (AAA) · APCA Lc 53
Contrast pairs
Fragmenty kodu
CSS
:root {
--toasted-husk: #ed8a53;
--toasted-husk-rgb: 237 138 83;
--toasted-husk-oklch: oklch(0.729 0.14 48.4);
}
.element {
color: var(--toasted-husk);
background-color: hsl(21 81% 63%);
border-color: oklch(0.729 0.14 48.4);
}Tailwind CSS v4
@theme {
--color-toasted-husk: #ed8a53;
--color-toasted-husk-50: #ffebd2;
--color-toasted-husk-100: #ffdbbf;
--color-toasted-husk-200: #ffc39e;
--color-toasted-husk-300: #f1a275;
--color-toasted-husk-400: #e0834f;
--color-toasted-husk-500: #cd641f;
--color-toasted-husk-600: #ad551e;
--color-toasted-husk-700: #8b4418;
--color-toasted-husk-800: #683011;
--color-toasted-husk-900: #49210b;
--color-toasted-husk-950: #301001;
}SCSS
$toasted-husk: #ed8a53;
$toasted-husk-rgb: 237, 138, 83;
$toasted-husk-light: mix(#fff, $toasted-husk, 20%);
$toasted-husk-dark: mix(#000, $toasted-husk, 20%);
.element {
color: $toasted-husk;
box-shadow: 0 0 0 2px rgba($toasted-husk, 0.35);
}