Nazwany kolor · #EBCF7D
Choux à la Crème
Choux à la Crème to #EBCF7D: rgb(235 207 125), hsl(45 73% 71%), oklch(0.861 0.106 91.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Choux à la Crème color name →
#EBCF7D
oklch(0.861 0.106 91.2)
Konwersje koloru
- HEX
- #ebcf7d
- RGB
- rgb(235 207 125)
- HSL
- hsl(45 73% 71%)
- HWB
- hwb(45 49% 8%)
- OKLCH
- oklch(0.861 0.106 91.2)
- OKLab
- oklab(0.861 -0.002 0.106)
- CIE Lab
- lab(84.2 2.39 44.31)
- LCH
- lch(84.2 44.38 86.9)
- CMYK
- cmyk(0% 12% 47% 8%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- EDD48B
- EFD999
- F1DEA6
- F3E3B3
- F5E7C0
- F7ECCD
- F9F1DA
- FBF6E6
- FDFAF3
Odcienie ciemniejsze
- CCB46C
- AE995B
- 917F4B
- 75673B
- 5B4F2C
- 41381E
- 292311
- 131005
- 030201
Tony
- E0C77F
- D5BF80
- CAB781
- BFAF81
- B4A782
- A99F82
- 9F9782
- 949081
- 8A8881
Harmonie kolorów
Komplementarna +180°
- EBCF7D
Choux à la Crème
- C0CFFF
≈ Lavender Blue
Analogowa -30° +30°
- EBCF7D
Choux à la Crème
- FFC391
≈ Tuscan Wall
- C6DC8C
≈ Tree Line
Triada +120° +240°
- EBCF7D
Choux à la Crème
- 73E4F9
≈ Robin’s Egg
- FAB8F1
≈ Sweet Slumber Pink
Komplementarna rozszczepiona +150° +210°
- EBCF7D
Choux à la Crème
- A5D8FF
≈ Malmö FF
- DAC5FF
≈ Neon Boneyard
Tetrada +90° +180° +270°
- EBCF7D
Choux à la Crème
- 79E8D5
≈ Turquoise Chalk
- C0CFFF
≈ Lavender Blue
- FFBCCE
≈ Rosie
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.52:1 · APCA Lc 24
Ag
AAANa czerni
WCAG 13.75:1 · APCA Lc 79
Najlepszy kolor tekstu: #000000
WCAG 13.75:1 (AAA) · APCA Lc 79
Contrast pairs
Fragmenty kodu
CSS
:root {
--choux-a-la-creme: #ebcf7d;
--choux-a-la-creme-rgb: 235 207 125;
--choux-a-la-creme-oklch: oklch(0.861 0.106 91.2);
}
.element {
color: var(--choux-a-la-creme);
background-color: hsl(45 73% 71%);
border-color: oklch(0.861 0.106 91.2);
}Tailwind CSS v4
@theme {
--color-choux-a-la-creme: #ebcf7d;
--color-choux-a-la-creme-50: #fff5d3;
--color-choux-a-la-creme-100: #f4e8c0;
--color-choux-a-la-creme-200: #e4d4a1;
--color-choux-a-la-creme-300: #cab777;
--color-choux-a-la-creme-400: #b69c4f;
--color-choux-a-la-creme-500: #a0831e;
--color-choux-a-la-creme-600: #876f1d;
--color-choux-a-la-creme-700: #6d5917;
--color-choux-a-la-creme-800: #51400e;
--color-choux-a-la-creme-900: #382c09;
--color-choux-a-la-creme-950: #231900;
}SCSS
$choux-a-la-creme: #ebcf7d;
$choux-a-la-creme-rgb: 235, 207, 125;
$choux-a-la-creme-light: mix(#fff, $choux-a-la-creme, 20%);
$choux-a-la-creme-dark: mix(#000, $choux-a-la-creme, 20%);
.element {
color: $choux-a-la-creme;
box-shadow: 0 0 0 2px rgba($choux-a-la-creme, 0.35);
}