Nazwany kolor · #E59752
Butternut Pizazz
Butternut Pizazz to #E59752: rgb(229 151 82), hsl(28 74% 61%), oklch(0.742 0.127 60.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Butternut Pizazz color name →
#E59752
oklch(0.742 0.127 60.3)
Konwersje koloru
- HEX
- #e59752
- RGB
- rgb(229 151 82)
- HSL
- hsl(28 74% 61%)
- HWB
- hwb(28 32% 10%)
- OKLCH
- oklch(0.742 0.127 60.3)
- OKLab
- oklab(0.742 0.063 0.11)
- CIE Lab
- lab(69.56 25.51 48.15)
- LCH
- lch(69.56 54.49 62.1)
- CMYK
- cmyk(0% 34% 64% 10%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E8A265
- ECAC78
- EFB789
- F2C19A
- F4CCAB
- F7D6BC
- F9E0CD
- FBEADD
- FDF5EE
Odcienie ciemniejsze
- C78346
- AA6F3B
- 8E5C2F
- 724925
- 58371A
- 3F2611
- 281708
- 120802
- 030100
Tony
- DB9559
- D1935F
- C79164
- BD8F69
- B38D6E
- A98A72
- 9F8876
- 95857A
- 8A837D
Harmonie kolorów
Komplementarna +180°
- E59752
Butternut Pizazz
- 57B5F3
≈ Tiān Lán Sky
Analogowa -30° +30°
- E59752
Butternut Pizazz
- F08B7A
≈ Corralize
- CAA740
≈ Aniseed
Triada +120° +240°
- E59752
Butternut Pizazz
- 29C5AF
≈ Amazonite
- B898EF
≈ Bright Lavender
Komplementarna rozszczepiona +150° +210°
- E59752
Butternut Pizazz
- 11C0D8
≈ The Crowd Roars!
- 8DA6FB
≈ Widowmaker
Tetrada +90° +180° +270°
- E59752
Butternut Pizazz
- 6BC280
≈ Clover Mist
- 57B5F3
≈ Tiān Lán Sky
- D88DD1
≈ Firm Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.36:1 · APCA Lc 46
Ag
AAANa czerni
WCAG 8.88:1 · APCA Lc 56
Najlepszy kolor tekstu: #000000
WCAG 8.88:1 (AAA) · APCA Lc 56
Contrast pairs
Fragmenty kodu
CSS
:root {
--butternut-pizazz: #e59752;
--butternut-pizazz-rgb: 229 151 82;
--butternut-pizazz-oklch: oklch(0.742 0.127 60.3);
}
.element {
color: var(--butternut-pizazz);
background-color: hsl(28 74% 61%);
border-color: oklch(0.742 0.127 60.3);
}Tailwind CSS v4
@theme {
--color-butternut-pizazz: #e59752;
--color-butternut-pizazz-50: #ffeed1;
--color-butternut-pizazz-100: #ffdfbd;
--color-butternut-pizazz-200: #fcc99c;
--color-butternut-pizazz-300: #e6a972;
--color-butternut-pizazz-400: #d48b4b;
--color-butternut-pizazz-500: #c16f13;
--color-butternut-pizazz-600: #a35e15;
--color-butternut-pizazz-700: #834b11;
--color-butternut-pizazz-800: #62360c;
--color-butternut-pizazz-900: #452507;
--color-butternut-pizazz-950: #2c1300;
}SCSS
$butternut-pizazz: #e59752;
$butternut-pizazz-rgb: 229, 151, 82;
$butternut-pizazz-light: mix(#fff, $butternut-pizazz, 20%);
$butternut-pizazz-dark: mix(#000, $butternut-pizazz, 20%);
.element {
color: $butternut-pizazz;
box-shadow: 0 0 0 2px rgba($butternut-pizazz, 0.35);
}