Couleur nommée · #C3DDEE
Island View
Island View correspond à #C3DDEE : rgb(195 221 238), hsl(204 56% 85%), oklch(0.884 0.036 236.5). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Blue mean? → · Island View color name →
#C3DDEE
oklch(0.884 0.036 236.5)
Conversions de couleur
- HEX
- #c3ddee
- RGB
- rgb(195 221 238)
- HSL
- hsl(204 56% 85%)
- HWB
- hwb(204 76% 7%)
- OKLCH
- oklch(0.884 0.036 236.5)
- OKLab
- oklab(0.884 -0.02 -0.03)
- CIE Lab
- lab(86.58 -6.3 -11.41)
- LCH
- lch(86.58 13.03 241.1)
- CMYK
- cmyk(18% 7% 0% 7%)
Teintes · Ombres · Tons
Teintes
- C9E0F0
- CFE4F1
- D5E7F3
- DBEBF5
- E1EEF7
- E7F1F8
- EDF5FA
- F3F8FC
- F9FCFD
Ombres
- A9C0CF
- 90A4B1
- 788893
- 606E77
- 4A555C
- 343D42
- 20262A
- 0E1114
- 020203
Tons
- BCD3E2
- B5CAD7
- AFC0CC
- A8B7C1
- A1ADB6
- 9AA4AB
- 949BA0
- 8D9295
- 87898A
Harmonies de couleurs
Complémentaire +180°
- C3DDEE
Island View
- ECD3C2
≈ Enjoy
Analogue -30° +30°
- C3DDEE
Island View
- BEE0E5
≈ Aquarelle Blue
- CED9F2
≈ Flax Bloom
Triadique +120° +240°
- C3DDEE
Island View
- EECFD9
≈ Creamy Freesia
- D7DCC1
≈ Breezeway
Complémentaire divisée +150° +210°
- C3DDEE
Island View
- F0D0CC
≈ Romantic Déjà Vu
- E3D8BE
≈ Pale Parsnip
Tétradique +90° +180° +270°
- C3DDEE
Island View
- E6D1E6
≈ Lilacs in Spring
- ECD3C2
≈ Enjoy
- CAE0CB
≈ Spring Burst
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.40:1 · APCA Lc 20
Ag
AAASur noir
WCAG 14.89:1 · APCA Lc 84
Meilleure couleur de texte: #000000
WCAG 14.89:1 (AAA) · APCA Lc 84
Contrast pairs
Extraits de code
CSS
:root {
--island-view: #c3ddee;
--island-view-rgb: 195 221 238;
--island-view-oklch: oklch(0.884 0.036 236.5);
}
.element {
color: var(--island-view);
background-color: hsl(204 56% 85%);
border-color: oklch(0.884 0.036 236.5);
}Tailwind CSS v4
@theme {
--color-island-view: #c3ddee;
--color-island-view-50: #ecf7ff;
--color-island-view-100: #ddeaf3;
--color-island-view-200: #c7d7e2;
--color-island-view-300: #a7bbc8;
--color-island-view-400: #8ba2b1;
--color-island-view-500: #708a9b;
--color-island-view-600: #5f7583;
--color-island-view-700: #4c5e69;
--color-island-view-800: #36454d;
--color-island-view-900: #252f36;
--color-island-view-950: #141c21;
}SCSS
$island-view: #c3ddee;
$island-view-rgb: 195, 221, 238;
$island-view-light: mix(#fff, $island-view, 20%);
$island-view-dark: mix(#000, $island-view, 20%);
.element {
color: $island-view;
box-shadow: 0 0 0 2px rgba($island-view, 0.35);
}