Adlandırılmış renk · #C6E0E1
Wishy-Washy Blue
Wishy-Washy Blue, #C6E0E1: rgb(198 224 225), hsl(182 31% 83%), oklch(0.888 0.028 199.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? → · Wishy-Washy Blue color name →
#C6E0E1
oklch(0.888 0.028 199.5)
Renk dönüşümleri
- HEX
- #c6e0e1
- RGB
- rgb(198 224 225)
- HSL
- hsl(182 31% 83%)
- HWB
- hwb(182 78% 12%)
- OKLCH
- oklch(0.888 0.028 199.5)
- OKLab
- oklab(0.888 -0.026 -0.009)
- CIE Lab
- lab(87.27 -8.76 -3.56)
- LCH
- lch(87.27 9.46 202.1)
- CMYK
- cmyk(12% 0% 0% 12%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- CCE3E4
- D1E6E7
- D7E9EA
- DDECED
- E2EFF0
- E8F3F3
- EEF6F6
- F4F9F9
- F9FCFC
Koyu tonlar
- ACC3C4
- 92A6A7
- 7A8A8B
- 627070
- 4B5656
- 353E3E
- 212727
- 0E1212
- 020202
Gri tonlar
- BFD6D7
- B8CCCD
- B1C2C3
- AAB8B9
- A3AFAF
- 9CA5A6
- 959C9C
- 8E9293
- 878989
Renk uyumları
Tamamlayıcı +180°
- C6E0E1
Wishy-Washy Blue
- ECD3D3
≈ Charming Pink
Analog -30° +30°
- C6E0E1
Wishy-Washy Blue
- C9E0D7
≈ Ulthuan Grey
- C8DEE9
≈ Wind of Change
Üçlü +120° +240°
- C6E0E1
Wishy-Washy Blue
- E2D5E6
≈ Old Chalk
- E4D8C6
≈ Sandcastle
Bölünmüş tamamlayıcı +150° +210°
- C6E0E1
Wishy-Washy Blue
- E9D3DD
≈ Light Favourite Lady
- EAD5CA
≈ Blushing Coconut
Dörtlü +90° +180° +270°
- C6E0E1
Wishy-Washy Blue
- D9D7EC
≈ Eyeshadow
- ECD3D3
≈ Charming Pink
- DBDCC7
≈ I Miss You
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.38:1 · APCA Lc 19
Ag
AAASiyah üzerinde
WCAG 15.15:1 · APCA Lc 85
En iyi metin rengi: #000000
WCAG 15.15:1 (AAA) · APCA Lc 85
Contrast pairs
Kod parçacıkları
CSS
:root {
--wishy-washy-blue: #c6e0e1;
--wishy-washy-blue-rgb: 198 224 225;
--wishy-washy-blue-oklch: oklch(0.888 0.028 199.5);
}
.element {
color: var(--wishy-washy-blue);
background-color: hsl(182 31% 83%);
border-color: oklch(0.888 0.028 199.5);
}Tailwind CSS v4
@theme {
--color-wishy-washy-blue: #c6e0e1;
--color-wishy-washy-blue-50: #edf8f8;
--color-wishy-washy-blue-100: #deebec;
--color-wishy-washy-blue-200: #c7d8d9;
--color-wishy-washy-blue-300: #a8bcbd;
--color-wishy-washy-blue-400: #8ca4a5;
--color-wishy-washy-blue-500: #718c8d;
--color-wishy-washy-blue-600: #607677;
--color-wishy-washy-blue-700: #4d5f60;
--color-wishy-washy-blue-800: #384546;
--color-wishy-washy-blue-900: #263030;
--color-wishy-washy-blue-950: #141c1c;
}SCSS
$wishy-washy-blue: #c6e0e1;
$wishy-washy-blue-rgb: 198, 224, 225;
$wishy-washy-blue-light: mix(#fff, $wishy-washy-blue, 20%);
$wishy-washy-blue-dark: mix(#000, $wishy-washy-blue, 20%);
.element {
color: $wishy-washy-blue;
box-shadow: 0 0 0 2px rgba($wishy-washy-blue, 0.35);
}