Benannte Farbe · #ECCEB9
Aristocrat Peach
Aristocrat Peach ist #ECCEB9: rgb(236 206 185), hsl(25 57% 83%), oklch(0.871 0.044 57.1). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Aristocrat Peach color name →
#ECCEB9
oklch(0.871 0.044 57.1)
Farbumrechnungen
- HEX
- #ecceb9
- RGB
- rgb(236 206 185)
- HSL
- hsl(25 57% 83%)
- HWB
- hwb(25 73% 7%)
- OKLCH
- oklch(0.871 0.044 57.1)
- OKLab
- oklab(0.871 0.024 0.037)
- CIE Lab
- lab(84.92 8.49 14.56)
- LCH
- lch(84.92 16.85 59.8)
- CMYK
- cmyk(0% 13% 22% 7%)
Tints · Shades · Tones
Tints
- EED3C0
- F0D8C7
- F2DDCE
- F4E2D5
- F6E6DC
- F8EBE3
- FAF0EA
- FBF5F1
- FDFAF8
Shades
- CDB3A0
- AF9889
- 927F71
- 76665B
- 5B4E46
- 423831
- 29231E
- 130F0D
- 030202
Tones
- E1C6B3
- D6BEAD
- CBB6A8
- C0AEA2
- B5A69C
- AA9E97
- 9F9791
- 958F8B
- 8A8886
Farbharmonien
Komplementär +180°
- ECCEB9
Aristocrat Peach
- BADAEF
≈ Sleepless Blue
Analog -30° +30°
- ECCEB9
Aristocrat Peach
- F1CAC5
≈ First Peach
- E1D3B4
≈ Garden Lattice
Triadisch +120° +240°
- ECCEB9
Aristocrat Peach
- B7DFD4
≈ Mint Mist
- D7CFEF
≈ Plum’s the Word
Geteilt komplementär +150° +210°
- ECCEB9
Aristocrat Peach
- B4DDE3
≈ Basin Blue
- C8D4F3
≈ Frozen Periwinkle
Tetradisch +90° +180° +270°
- ECCEB9
Aristocrat Peach
- C2DDC4
≈ Soft Grass
- BADAEF
≈ Sleepless Blue
- E5CBE4
≈ Footie Pyjamas
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.48:1 · APCA Lc 23
Ag
AAAAuf Schwarz
WCAG 14.09:1 · APCA Lc 80
Beste Textfarbe: #000000
WCAG 14.09:1 (AAA) · APCA Lc 80
Contrast pairs
Code-Snippets
CSS
:root {
--aristocrat-peach: #ecceb9;
--aristocrat-peach-rgb: 236 206 185;
--aristocrat-peach-oklch: oklch(0.871 0.044 57.1);
}
.element {
color: var(--aristocrat-peach);
background-color: hsl(25 57% 83%);
border-color: oklch(0.871 0.044 57.1);
}Tailwind CSS v4
@theme {
--color-aristocrat-peach: #ecceb9;
--color-aristocrat-peach-50: #fff2e9;
--color-aristocrat-peach-100: #f4e5da;
--color-aristocrat-peach-200: #e3d0c2;
--color-aristocrat-peach-300: #c9b3a1;
--color-aristocrat-peach-400: #b39885;
--color-aristocrat-peach-500: #9d7f6a;
--color-aristocrat-peach-600: #856c5a;
--color-aristocrat-peach-700: #6b5648;
--color-aristocrat-peach-800: #4f3f34;
--color-aristocrat-peach-900: #372b23;
--color-aristocrat-peach-950: #221812;
}SCSS
$aristocrat-peach: #ecceb9;
$aristocrat-peach-rgb: 236, 206, 185;
$aristocrat-peach-light: mix(#fff, $aristocrat-peach, 20%);
$aristocrat-peach-dark: mix(#000, $aristocrat-peach, 20%);
.element {
color: $aristocrat-peach;
box-shadow: 0 0 0 2px rgba($aristocrat-peach, 0.35);
}