Warna bernama · #C3D4E7
Cry Baby Blue
Cry Baby Blue adalah #C3D4E7: rgb(195 212 231), hsl(212 43% 84%), oklch(0.863 0.032 251.2). Lihat tint, shade, harmoni, kontras WCAG & APCA, serta kode CSS, Tailwind v4, dan SCSS.
What does Gray mean? → · Cry Baby Blue color name →
#C3D4E7
oklch(0.863 0.032 251.2)
Konversi warna
- HEX
- #c3d4e7
- RGB
- rgb(195 212 231)
- HSL
- hsl(212 43% 84%)
- HWB
- hwb(212 76% 9%)
- OKLCH
- oklch(0.863 0.032 251.2)
- OKLab
- oklab(0.863 -0.01 -0.03)
- CIE Lab
- lab(84.06 -3.05 -11.45)
- LCH
- lch(84.06 11.85 255.1)
- CMYK
- cmyk(16% 8% 0% 9%)
Tint · Shade · Tone
Tint
- C9D8E9
- CFDDEC
- D5E1EE
- DBE5F1
- E1E9F3
- E7EEF5
- EDF2F8
- F3F6FA
- F9FBFD
Shade
- A9B8C9
- 909DAB
- 78838F
- 606973
- 4A5159
- 343A40
- 202428
- 0E1013
- 020203
Tone
- BCCBDC
- B5C3D2
- AEBAC7
- A8B2BD
- A1A9B2
- 9AA1A8
- 94989E
- 8D9094
- 86888A
Harmoni warna
Komplementer +180°
- C3D4E7
Cry Baby Blue
- E0CFBC
≈ Dainty Lace
Analog -30° +30°
- C3D4E7
Cry Baby Blue
- BCD7E1
≈ Bridgewater Bay
- CED0E7
≈ Artistic Violet
Triadik +120° +240°
- C3D4E7
Cry Baby Blue
- E6CACD
≈ Pink Spinel
- CBD7C1
≈ Hawthorne
Split-komplementer +150° +210°
- C3D4E7
Cry Baby Blue
- E6CCC2
≈ Pout
- D6D3BB
≈ Pistachio Tang
Tetradik +90° +180° +270°
- C3D4E7
Cry Baby Blue
- E2CAD8
≈ Diva Girl
- E0CFBC
≈ Dainty Lace
- C0D9CB
≈ Snow Goose
Kontras & aksesibilitas
Ag
FailDi atas putih
WCAG 1.51:1 · APCA Lc 24
Ag
AAADi atas hitam
WCAG 13.89:1 · APCA Lc 79
Warna teks terbaik: #000000
WCAG 13.89:1 (AAA) · APCA Lc 79
Contrast pairs
Cuplikan kode
CSS
:root {
--cry-baby-blue: #c3d4e7;
--cry-baby-blue-rgb: 195 212 231;
--cry-baby-blue-oklch: oklch(0.863 0.032 251.2);
}
.element {
color: var(--cry-baby-blue);
background-color: hsl(212 43% 84%);
border-color: oklch(0.863 0.032 251.2);
}Tailwind CSS v4
@theme {
--color-cry-baby-blue: #c3d4e7;
--color-cry-baby-blue-50: #eff6fe;
--color-cry-baby-blue-100: #e1e9f3;
--color-cry-baby-blue-200: #cbd5e2;
--color-cry-baby-blue-300: #acb9c8;
--color-cry-baby-blue-400: #91a0b1;
--color-cry-baby-blue-500: #77889b;
--color-cry-baby-blue-600: #657383;
--color-cry-baby-blue-700: #505c69;
--color-cry-baby-blue-800: #3a434d;
--color-cry-baby-blue-900: #282f36;
--color-cry-baby-blue-950: #161b21;
}SCSS
$cry-baby-blue: #c3d4e7;
$cry-baby-blue-rgb: 195, 212, 231;
$cry-baby-blue-light: mix(#fff, $cry-baby-blue, 20%);
$cry-baby-blue-dark: mix(#000, $cry-baby-blue, 20%);
.element {
color: $cry-baby-blue;
box-shadow: 0 0 0 2px rgba($cry-baby-blue, 0.35);
}