Adlandırılmış renk · #C4ECF0
Icy Breeze
Icy Breeze, #C4ECF0: rgb(196 236 240), hsl(185 59% 85%), oklch(0.916 0.042 203.9). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Cyan mean? → · Icy Breeze color name →
#C4ECF0
oklch(0.916 0.042 203.9)
Renk dönüşümleri
- HEX
- #c4ecf0
- RGB
- rgb(196 236 240)
- HSL
- hsl(185 59% 85%)
- HWB
- hwb(185 77% 6%)
- OKLCH
- oklch(0.916 0.042 203.9)
- OKLab
- oklab(0.916 -0.038 -0.017)
- CIE Lab
- lab(90.64 -12.78 -6.49)
- LCH
- lch(90.64 14.33 206.9)
- CMYK
- cmyk(18% 2% 0% 6%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- CAEEF2
- D0F0F3
- D6F2F5
- DCF4F6
- E2F6F8
- E8F7F9
- EEF9FB
- F3FBFC
- F9FDFE
Koyu tonlar
- AACDD1
- 91AFB2
- 789295
- 617678
- 4A5B5D
- 354243
- 21292A
- 0E1314
- 020303
Gri tonlar
- BDE1E4
- B6D6D9
- AFCACD
- A9BFC2
- A2B5B6
- 9BAAAB
- 949FA0
- 8E9595
- 878A8B
Renk uyumları
Tamamlayıcı +180°
- C4ECF0
Icy Breeze
- FED9D6
≈ Forgotten Pink
Analog -30° +30°
- C4ECF0
Icy Breeze
- C8EDE1
≈ Teal Melody
- C9E9FB
≈ Icy Landscape
Üçlü +120° +240°
- C4ECF0
Icy Breeze
- F2DAF3
≈ Grape Taffy
- F1E2C4
≈ Cloud of Cream
Bölünmüş tamamlayıcı +150° +210°
- C4ECF0
Icy Breeze
- FBD8E5
≈ Lovely Breeze
- FBDDCA
≈ Shironeri Silk
Dörtlü +90° +180° +270°
- C4ECF0
Icy Breeze
- E4DFFD
≈ Stoic White
- FED9D6
≈ Forgotten Pink
- E2E7C8
≈ Origami Clover
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.26:1 · APCA Lc 13
Ag
AAASiyah üzerinde
WCAG 16.60:1 · APCA Lc 91
En iyi metin rengi: #000000
WCAG 16.60:1 (AAA) · APCA Lc 91
Contrast pairs
Kod parçacıkları
CSS
:root {
--icy-breeze: #c4ecf0;
--icy-breeze-rgb: 196 236 240;
--icy-breeze-oklch: oklch(0.916 0.042 203.9);
}
.element {
color: var(--icy-breeze);
background-color: hsl(185 59% 85%);
border-color: oklch(0.916 0.042 203.9);
}Tailwind CSS v4
@theme {
--color-icy-breeze: #c4ecf0;
--color-icy-breeze-50: #e8f9fb;
--color-icy-breeze-100: #d9ecef;
--color-icy-breeze-200: #c1dadd;
--color-icy-breeze-300: #9fbec2;
--color-icy-breeze-400: #82a6aa;
--color-icy-breeze-500: #658f93;
--color-icy-breeze-600: #56797c;
--color-icy-breeze-700: #456163;
--color-icy-breeze-800: #314748;
--color-icy-breeze-900: #213132;
--color-icy-breeze-950: #111d1e;
}SCSS
$icy-breeze: #c4ecf0;
$icy-breeze-rgb: 196, 236, 240;
$icy-breeze-light: mix(#fff, $icy-breeze, 20%);
$icy-breeze-dark: mix(#000, $icy-breeze, 20%);
.element {
color: $icy-breeze;
box-shadow: 0 0 0 2px rgba($icy-breeze, 0.35);
}