Nazwany kolor · #EFE5BB
Designer Cream Yellow
Designer Cream Yellow to #EFE5BB: rgb(239 229 187), hsl(48 62% 84%), oklch(0.919 0.056 96.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Designer Cream Yellow color name →
#EFE5BB
oklch(0.919 0.056 96.2)
Konwersje koloru
- HEX
- #efe5bb
- RGB
- rgb(239 229 187)
- HSL
- hsl(48 62% 84%)
- HWB
- hwb(48 73% 6%)
- OKLCH
- oklch(0.919 0.056 96.2)
- OKLab
- oklab(0.919 -0.006 0.056)
- CIE Lab
- lab(90.96 -1.35 21.86)
- LCH
- lch(90.96 21.9 93.5)
- CMYK
- cmyk(0% 4% 22% 6%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F1E8C2
- F2EAC9
- F4EDD0
- F5EFD6
- F7F2DD
- F9F5E4
- FAF7EB
- FCFAF2
- FDFCF8
Odcienie ciemniejsze
- D0C7A2
- B1AA8A
- 948E73
- 78725C
- 5C5846
- 423F32
- 2A281F
- 14120D
- 030302
Tony
- E3DAB5
- D8D0AF
- CCC6A9
- C1BBA3
- B6B19E
- ABA798
- A09D92
- 95938C
- 8A8A86
Harmonie kolorów
Komplementarna +180°
- EFE5BB
Designer Cream Yellow
- DDE3FF
≈ Stoic White
Analogowa -30° +30°
- EFE5BB
Designer Cream Yellow
- FFDEBE
≈ Odious Orange
- DBECC4
≈ Greenette
Triada +120° +240°
- EFE5BB
Designer Cream Yellow
- BBEEFC
≈ Ice Effect
- FDD7F3
≈ Sweet Sachet
Komplementarna rozszczepiona +150° +210°
- EFE5BB
Designer Cream Yellow
- CFE8FF
≈ Veiling Waterfalls
- ECDDFF
≈ Lavender Savour
Tetrada +90° +180° +270°
- EFE5BB
Designer Cream Yellow
- BBF1EA
≈ Light Water Wings
- DDE3FF
≈ Stoic White
- FFD9E0
≈ It’s a Girl!
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.26:1 · APCA Lc 13
Ag
AAANa czerni
WCAG 16.59:1 · APCA Lc 91
Najlepszy kolor tekstu: #000000
WCAG 16.59:1 (AAA) · APCA Lc 91
Contrast pairs
Fragmenty kodu
CSS
:root {
--designer-cream-yellow: #efe5bb;
--designer-cream-yellow-rgb: 239 229 187;
--designer-cream-yellow-oklch: oklch(0.919 0.056 96.2);
}
.element {
color: var(--designer-cream-yellow);
background-color: hsl(48 62% 84%);
border-color: oklch(0.919 0.056 96.2);
}Tailwind CSS v4
@theme {
--color-designer-cream-yellow: #efe5bb;
--color-designer-cream-yellow-50: #f9f6e4;
--color-designer-cream-yellow-100: #ece8d4;
--color-designer-cream-yellow-200: #dad5ba;
--color-designer-cream-yellow-300: #bfb898;
--color-designer-cream-yellow-400: #a89f79;
--color-designer-cream-yellow-500: #91865b;
--color-designer-cream-yellow-600: #7b724e;
--color-designer-cream-yellow-700: #625b3e;
--color-designer-cream-yellow-800: #49422c;
--color-designer-cream-yellow-900: #322e1e;
--color-designer-cream-yellow-950: #1e1a0e;
}SCSS
$designer-cream-yellow: #efe5bb;
$designer-cream-yellow-rgb: 239, 229, 187;
$designer-cream-yellow-light: mix(#fff, $designer-cream-yellow, 20%);
$designer-cream-yellow-dark: mix(#000, $designer-cream-yellow, 20%);
.element {
color: $designer-cream-yellow;
box-shadow: 0 0 0 2px rgba($designer-cream-yellow, 0.35);
}