Adlandırılmış renk · #9DCEE3
December Solstice
December Solstice, #9DCEE3: rgb(157 206 227), hsl(198 56% 75%), oklch(0.824 0.059 226.1). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Cyan mean? → · December Solstice color name →
#9DCEE3
oklch(0.824 0.059 226.1)
Renk dönüşümleri
- HEX
- #9dcee3
- RGB
- rgb(157 206 227)
- HSL
- hsl(198 56% 75%)
- HWB
- hwb(198 62% 11%)
- OKLCH
- oklch(0.824 0.059 226.1)
- OKLab
- oklab(0.824 -0.041 -0.042)
- CIE Lab
- lab(79.84 -12.87 -15.91)
- LCH
- lch(79.84 20.46 231)
- CMYK
- cmyk(31% 9% 0% 11%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- A7D3E6
- B1D8E9
- BBDDEC
- C5E2EE
- CEE7F1
- D8EBF4
- E2F0F7
- ECF5FA
- F5FAFC
Koyu tonlar
- 88B3C5
- 7398A8
- 5F7F8C
- 4C6671
- 3A4E57
- 28383F
- 182327
- 090F12
- 010203
Gri tonlar
- 9AC6D9
- 98BECF
- 95B6C4
- 92AEBA
- 8FA6B0
- 8D9FA7
- 8A979D
- 868F93
- 838889
Renk uyumları
Tamamlayıcı +180°
- 9DCEE3
December Solstice
- E7BAA6
≈ Diva Rouge
Analog -30° +30°
- 9DCEE3
December Solstice
- 98D2D2
≈ Summer Soft Blue
- ADC8EC
≈ Tropical Blue
Üçlü +120° +240°
- 9DCEE3
December Solstice
- E3B7CD
≈ Sweet Lilac
- CAC89C
≈ Shagreen
Bölünmüş tamamlayıcı +150° +210°
- 9DCEE3
December Solstice
- E9B7B8
≈ Summer Cocktails
- DCC19B
≈ Natural Twine
Dörtlü +90° +180° +270°
- 9DCEE3
December Solstice
- D5BAE0
≈ Plum Point
- E7BAA6
≈ Diva Rouge
- B5CFA9
≈ Gio Ponti Green
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.69:1 · APCA Lc 30
Ag
AAASiyah üzerinde
WCAG 12.37:1 · APCA Lc 73
En iyi metin rengi: #000000
WCAG 12.37:1 (AAA) · APCA Lc 73
Contrast pairs
Kod parçacıkları
CSS
:root {
--december-solstice: #9dcee3;
--december-solstice-rgb: 157 206 227;
--december-solstice-oklch: oklch(0.824 0.059 226.1);
}
.element {
color: var(--december-solstice);
background-color: hsl(198 56% 75%);
border-color: oklch(0.824 0.059 226.1);
}Tailwind CSS v4
@theme {
--color-december-solstice: #9dcee3;
--color-december-solstice-50: #e5f9ff;
--color-december-solstice-100: #d5ecf8;
--color-december-solstice-200: #bbdae8;
--color-december-solstice-300: #99becf;
--color-december-solstice-400: #79a6b9;
--color-december-solstice-500: #5a8fa4;
--color-december-solstice-600: #4d798b;
--color-december-solstice-700: #3d616f;
--color-december-solstice-800: #2b4752;
--color-december-solstice-900: #1d3139;
--color-december-solstice-950: #0d1d23;
}SCSS
$december-solstice: #9dcee3;
$december-solstice-rgb: 157, 206, 227;
$december-solstice-light: mix(#fff, $december-solstice, 20%);
$december-solstice-dark: mix(#000, $december-solstice, 20%);
.element {
color: $december-solstice;
box-shadow: 0 0 0 2px rgba($december-solstice, 0.35);
}