Benannte Farbe · #F6E19C
Buttery Croissant
Buttery Croissant ist #F6E19C: rgb(246 225 156), hsl(46 83% 79%), oklch(0.911 0.09 93.2). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Buttery Croissant color name →
#F6E19C
oklch(0.911 0.09 93.2)
Farbumrechnungen
- HEX
- #f6e19c
- RGB
- rgb(246 225 156)
- HSL
- hsl(46 83% 79%)
- HWB
- hwb(46 61% 4%)
- OKLCH
- oklch(0.911 0.09 93.2)
- OKLab
- oklab(0.911 -0.005 0.09)
- CIE Lab
- lab(90.09 0.37 36.56)
- LCH
- lch(90.09 36.56 89.4)
- CMYK
- cmyk(0% 9% 37% 4%)
Tints · Shades · Tones
Tints
- F7E4A7
- F8E7B1
- F9EABB
- FAEDC5
- FAF0CF
- FBF3D9
- FCF6E2
- FDF9EC
- FEFCF5
Shades
- D6C487
- B7A773
- 988B5F
- 7B704C
- 5F5639
- 453E28
- 2C2718
- 151209
- 030201
Tones
- EAD79A
- DDCD97
- D1C395
- C5B992
- B9B090
- ADA68D
- A29C8A
- 969387
- 8B8983
Farbharmonien
Komplementär +180°
- F6E19C
Buttery Croissant
- D8E0FF
≈ Contrail
Analog -30° +30°
- F6E19C
Buttery Croissant
- FFDAB9
≈ Peach Puff
- D6ECA9
≈ Faith
Triadisch +120° +240°
- F6E19C
Buttery Croissant
- A8EFFF
≈ Beyond the Clouds
- FFD1F6
≈ Shampoo
Geteilt komplementär +150° +210°
- F6E19C
Buttery Croissant
- C8E6FF
≈ Icy Landscape
- E8DAFF
≈ Lavender Savour
Tetradisch +90° +180° +270°
- F6E19C
Buttery Croissant
- 9AF6E7
≈ Turquoise Pearl
- D8E0FF
≈ Contrail
- FFD5DE
≈ No Need to Blush
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.29:1 · APCA Lc 15
Ag
AAAAuf Schwarz
WCAG 16.16:1 · APCA Lc 89
Beste Textfarbe: #000000
WCAG 16.16:1 (AAA) · APCA Lc 89
Contrast pairs
Code-Snippets
CSS
:root {
--buttery-croissant: #f6e19c;
--buttery-croissant-rgb: 246 225 156;
--buttery-croissant-oklch: oklch(0.911 0.09 93.2);
}
.element {
color: var(--buttery-croissant);
background-color: hsl(46 83% 79%);
border-color: oklch(0.911 0.09 93.2);
}Tailwind CSS v4
@theme {
--color-buttery-croissant: #f6e19c;
--color-buttery-croissant-50: #fdf6d9;
--color-buttery-croissant-100: #f1e8c7;
--color-buttery-croissant-200: #e0d5a9;
--color-buttery-croissant-300: #c5b882;
--color-buttery-croissant-400: #b19d5e;
--color-buttery-croissant-500: #9b8538;
--color-buttery-croissant-600: #837031;
--color-buttery-croissant-700: #695a27;
--color-buttery-croissant-800: #4e411a;
--color-buttery-croissant-900: #362d11;
--color-buttery-croissant-950: #211a04;
}SCSS
$buttery-croissant: #f6e19c;
$buttery-croissant-rgb: 246, 225, 156;
$buttery-croissant-light: mix(#fff, $buttery-croissant, 20%);
$buttery-croissant-dark: mix(#000, $buttery-croissant, 20%);
.element {
color: $buttery-croissant;
box-shadow: 0 0 0 2px rgba($buttery-croissant, 0.35);
}