Adlandırılmış renk · #EAE3D6
Sugar Swizzle
Sugar Swizzle, #EAE3D6: rgb(234 227 214), hsl(39 32% 88%), oklch(0.918 0.019 83.1). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Sugar Swizzle color name →
#EAE3D6
oklch(0.918 0.019 83.1)
Renk dönüşümleri
- HEX
- #eae3d6
- RGB
- rgb(234 227 214)
- HSL
- hsl(39 32% 88%)
- HWB
- hwb(39 84% 8%)
- OKLCH
- oklch(0.918 0.019 83.1)
- OKLab
- oklab(0.918 0.002 0.019)
- CIE Lab
- lab(90.53 0.82 7.26)
- LCH
- lch(90.53 7.31 83.6)
- CMYK
- cmyk(0% 3% 9% 8%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- ECE6DA
- EEE9DE
- F0EBE2
- F2EEE6
- F4F1EA
- F7F4EF
- F9F7F3
- FBF9F7
- FDFCFB
Koyu tonlar
- CBC5BA
- AEA89E
- 918C84
- 75716A
- 5A5752
- 413F3B
- 292725
- 131210
- 030302
Gri tonlar
- DFD9CD
- D4CEC4
- C9C4BB
- BEBAB3
- B4B0AA
- A9A6A1
- 9F9D99
- 949391
- 8A8988
Renk uyumları
Tamamlayıcı +180°
- EAE3D6
Sugar Swizzle
- DDE4F1
≈ Iris Ice
Analog -30° +30°
- EAE3D6
Sugar Swizzle
- EFE1D8
≈ Intimate White
- E3E5D7
≈ Olive Conquering White
Üçlü +120° +240°
- EAE3D6
Sugar Swizzle
- D6E8E9
≈ Boiling Point
- EAE0EB
≈ Angora Pink
Bölünmüş tamamlayıcı +150° +210°
- EAE3D6
Sugar Swizzle
- D8E6EF
≈ First Light
- E4E2F0
≈ Farsighted
Dörtlü +90° +180° +270°
- EAE3D6
Sugar Swizzle
- D8E8E3
≈ Aqua Breeze
- DDE4F1
≈ Iris Ice
- EFDFE5
≈ Roselle
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.27:1 · APCA Lc 14
Ag
AAASiyah üzerinde
WCAG 16.45:1 · APCA Lc 90
En iyi metin rengi: #000000
WCAG 16.45:1 (AAA) · APCA Lc 90
Contrast pairs
Kod parçacıkları
CSS
:root {
--sugar-swizzle: #eae3d6;
--sugar-swizzle-rgb: 234 227 214;
--sugar-swizzle-oklch: oklch(0.918 0.019 83.1);
}
.element {
color: var(--sugar-swizzle);
background-color: hsl(39 32% 88%);
border-color: oklch(0.918 0.019 83.1);
}Tailwind CSS v4
@theme {
--color-sugar-swizzle: #eae3d6;
--color-sugar-swizzle-50: #f8f5ef;
--color-sugar-swizzle-100: #ebe7e1;
--color-sugar-swizzle-200: #d8d4cb;
--color-sugar-swizzle-300: #bcb7ad;
--color-sugar-swizzle-400: #a49e92;
--color-sugar-swizzle-500: #8c8578;
--color-sugar-swizzle-600: #777166;
--color-sugar-swizzle-700: #5f5a51;
--color-sugar-swizzle-800: #46423b;
--color-sugar-swizzle-900: #302d29;
--color-sugar-swizzle-950: #1d1a16;
}SCSS
$sugar-swizzle: #eae3d6;
$sugar-swizzle-rgb: 234, 227, 214;
$sugar-swizzle-light: mix(#fff, $sugar-swizzle, 20%);
$sugar-swizzle-dark: mix(#000, $sugar-swizzle, 20%);
.element {
color: $sugar-swizzle;
box-shadow: 0 0 0 2px rgba($sugar-swizzle, 0.35);
}