Nazwany kolor · #EFE7D6
Remarkable Beige
Remarkable Beige to #EFE7D6: rgb(239 231 214), hsl(41 44% 89%), oklch(0.93 0.024 85.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Remarkable Beige color name →
#EFE7D6
oklch(0.93 0.024 85.8)
Konwersje koloru
- HEX
- #efe7d6
- RGB
- rgb(239 231 214)
- HSL
- hsl(41 44% 89%)
- HWB
- hwb(41 84% 6%)
- OKLCH
- oklch(0.93 0.024 85.8)
- OKLab
- oklab(0.93 0.002 0.024)
- CIE Lab
- lab(91.94 0.69 9.32)
- LCH
- lch(91.94 9.35 85.8)
- CMYK
- cmyk(0% 3% 10% 6%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F1E9DA
- F2ECDE
- F4EEE2
- F5F1E6
- F7F3EA
- F9F5EF
- FAF8F3
- FCFAF7
- FDFDFB
Odcienie ciemniejsze
- D0C9BA
- B1AB9E
- 948F84
- 78736A
- 5C5952
- 42403B
- 2A2825
- 141310
- 030302
Tony
- E3DCCD
- D8D2C4
- CCC7BB
- C1BDB3
- B6B2AA
- ABA8A1
- A09E99
- 959491
- 8B8A88
Harmonie kolorów
Komplementarna +180°
- EFE7D6
Remarkable Beige
- E0E8F9
≈ Husky
Analogowa -30° +30°
- EFE7D6
Remarkable Beige
- F5E4D9
≈ Cream Pink
- E7EAD8
≈ Reduced Green
Triada +120° +240°
- EFE7D6
Remarkable Beige
- D6EDF0
≈ Sparkling River
- F1E3F1
≈ Sheer Lavender
Komplementarna rozszczepiona +150° +210°
- EFE7D6
Remarkable Beige
- D9EBF6
≈ Celestial Cathedral
- E9E5F7
≈ Cyber Lavender
Tetrada +90° +180° +270°
- EFE7D6
Remarkable Beige
- D8EDE7
≈ Dew Pointe
- E0E8F9
≈ Husky
- F6E1E8
≈ First Crush
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.23:1 · APCA Lc 11
Ag
AAANa czerni
WCAG 17.07:1 · APCA Lc 93
Najlepszy kolor tekstu: #000000
WCAG 17.07:1 (AAA) · APCA Lc 93
Contrast pairs
Fragmenty kodu
CSS
:root {
--remarkable-beige: #efe7d6;
--remarkable-beige-rgb: 239 231 214;
--remarkable-beige-oklch: oklch(0.93 0.024 85.8);
}
.element {
color: var(--remarkable-beige);
background-color: hsl(41 44% 89%);
border-color: oklch(0.93 0.024 85.8);
}Tailwind CSS v4
@theme {
--color-remarkable-beige: #efe7d6;
--color-remarkable-beige-50: #f8f5ed;
--color-remarkable-beige-100: #ebe8df;
--color-remarkable-beige-200: #d8d4c9;
--color-remarkable-beige-300: #bcb7aa;
--color-remarkable-beige-400: #a59e8f;
--color-remarkable-beige-500: #8d8574;
--color-remarkable-beige-600: #787163;
--color-remarkable-beige-700: #605a4f;
--color-remarkable-beige-800: #464239;
--color-remarkable-beige-900: #312d27;
--color-remarkable-beige-950: #1d1a15;
}SCSS
$remarkable-beige: #efe7d6;
$remarkable-beige-rgb: 239, 231, 214;
$remarkable-beige-light: mix(#fff, $remarkable-beige, 20%);
$remarkable-beige-dark: mix(#000, $remarkable-beige, 20%);
.element {
color: $remarkable-beige;
box-shadow: 0 0 0 2px rgba($remarkable-beige, 0.35);
}