Adlandırılmış renk · #C9D9E7
Sea Breeze Green
Sea Breeze Green, #C9D9E7: rgb(201 217 231), hsl(208 38% 85%), oklch(0.878 0.026 244.5). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Sea Breeze Green color name →
#C9D9E7
oklch(0.878 0.026 244.5)
Renk dönüşümleri
- HEX
- #c9d9e7
- RGB
- rgb(201 217 231)
- HSL
- hsl(208 38% 85%)
- HWB
- hwb(208 79% 9%)
- OKLCH
- oklch(0.878 0.026 244.5)
- OKLab
- oklab(0.878 -0.011 -0.023)
- CIE Lab
- lab(85.8 -3.49 -8.83)
- LCH
- lch(85.8 9.5 248.5)
- CMYK
- cmyk(13% 6% 0% 9%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- CEDDE9
- D4E1EC
- D9E4EE
- DEE8F1
- E4ECF3
- E9F0F5
- EFF4F8
- F4F7FA
- FAFBFD
Koyu tonlar
- AEBCC9
- 95A1AB
- 7C868F
- 646C73
- 4C5359
- 363B40
- 222528
- 0F1113
- 020203
Gri tonlar
- C1D0DC
- BAC7D2
- B3BDC7
- ABB4BD
- A4ABB2
- 9DA3A8
- 959A9E
- 8E9194
- 87898A
Renk uyumları
Tamamlayıcı +180°
- C9D9E7
Sea Breeze Green
- E3D4C5
≈ Hanyauku
Analog -30° +30°
- C9D9E7
Sea Breeze Green
- C4DBE1
≈ Washing Powder White
- D1D6E8
≈ Chill in the Air
Üçlü +120° +240°
- C9D9E7
Sea Breeze Green
- E7D0D4
≈ Delicate Pink
- D3DAC8
≈ Light Feather Green
Bölünmüş tamamlayıcı +150° +210°
- C9D9E7
Sea Breeze Green
- E7D1CB
≈ Pianissimo
- DCD7C4
≈ Crêpe Papier
Dörtlü +90° +180° +270°
- C9D9E7
Sea Breeze Green
- E2D1DE
≈ Orchid Ice
- E3D4C5
≈ Hanyauku
- CADCCF
≈ Tenderness
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.44:1 · APCA Lc 21
Ag
AAASiyah üzerinde
WCAG 14.56:1 · APCA Lc 82
En iyi metin rengi: #000000
WCAG 14.56:1 (AAA) · APCA Lc 82
Contrast pairs
Kod parçacıkları
CSS
:root {
--sea-breeze-green: #c9d9e7;
--sea-breeze-green-rgb: 201 217 231;
--sea-breeze-green-oklch: oklch(0.878 0.026 244.5);
}
.element {
color: var(--sea-breeze-green);
background-color: hsl(208 38% 85%);
border-color: oklch(0.878 0.026 244.5);
}Tailwind CSS v4
@theme {
--color-sea-breeze-green: #c9d9e7;
--color-sea-breeze-green-50: #eff6fc;
--color-sea-breeze-green-100: #e1e9f0;
--color-sea-breeze-green-200: #ccd6df;
--color-sea-breeze-green-300: #adb9c4;
--color-sea-breeze-green-400: #92a0ad;
--color-sea-breeze-green-500: #788897;
--color-sea-breeze-green-600: #66737f;
--color-sea-breeze-green-700: #515c66;
--color-sea-breeze-green-800: #3b444b;
--color-sea-breeze-green-900: #282f34;
--color-sea-breeze-green-950: #161b1f;
}SCSS
$sea-breeze-green: #c9d9e7;
$sea-breeze-green-rgb: 201, 217, 231;
$sea-breeze-green-light: mix(#fff, $sea-breeze-green, 20%);
$sea-breeze-green-dark: mix(#000, $sea-breeze-green, 20%);
.element {
color: $sea-breeze-green;
box-shadow: 0 0 0 2px rgba($sea-breeze-green, 0.35);
}