Warna bernama · #ABC8D8
Sonata
Sonata adalah #ABC8D8: rgb(171 200 216), hsl(201 37% 76%), oklch(0.816 0.039 232). Lihat tint, shade, harmoni, kontras WCAG & APCA, serta kode CSS, Tailwind v4, dan SCSS.
What does Blue mean? → · Sonata color name →
#ABC8D8
oklch(0.816 0.039 232)
Konversi warna
- HEX
- #abc8d8
- RGB
- rgb(171 200 216)
- HSL
- hsl(201 37% 76%)
- HWB
- hwb(201 67% 15%)
- OKLCH
- oklch(0.816 0.039 232)
- OKLab
- oklab(0.816 -0.024 -0.03)
- CIE Lab
- lab(78.83 -7.51 -11.44)
- LCH
- lch(78.83 13.68 236.7)
- CMYK
- cmyk(21% 7% 0% 15%)
Tint · Shade · Tone
Tint
- B3CDDC
- BCD3E0
- C4D8E4
- CCDEE8
- D5E3EC
- DDE9EF
- E6EEF3
- EEF4F7
- F6F9FB
Shade
- 94AEBC
- 7E94A0
- 687B85
- 54636B
- 404C53
- 2D363B
- 1B2125
- 0B0F11
- 010202
Tone
- A7C1CF
- A2B9C6
- 9EB2BD
- 9AABB4
- 96A3AB
- 919CA2
- 8D959A
- 898E91
- 848788
Harmoni warna
Komplementer +180°
- ABC8D8
Sonata
- D8BDAD
≈ Linen Cloth
Analog -30° +30°
- ABC8D8
Sonata
- A7CBCE
≈ Sky Chase
- B6C4DD
≈ Purpletini
Triadik +120° +240°
- ABC8D8
Sonata
- D8B9C5
≈ Lavender Blessing
- C3C6AA
≈ Balance Green
Split-komplementer +150° +210°
- ABC8D8
Sonata
- DBBAB8
≈ Rose Hip Tonic
- D0C1A7
≈ Baja
Tetradik +90° +180° +270°
Kontras & aksesibilitas
Ag
FailDi atas putih
WCAG 1.75:1 · APCA Lc 32
Ag
AAADi atas hitam
WCAG 11.98:1 · APCA Lc 71
Warna teks terbaik: #000000
WCAG 11.98:1 (AAA) · APCA Lc 71
Contrast pairs
Cuplikan kode
CSS
:root {
--sonata: #abc8d8;
--sonata-rgb: 171 200 216;
--sonata-oklch: oklch(0.816 0.039 232);
}
.element {
color: var(--sonata);
background-color: hsl(201 37% 76%);
border-color: oklch(0.816 0.039 232);
}Tailwind CSS v4
@theme {
--color-sonata: #abc8d8;
--color-sonata-50: #ebf7ff;
--color-sonata-100: #dceaf3;
--color-sonata-200: #c5d7e2;
--color-sonata-300: #a5bbc8;
--color-sonata-400: #88a3b2;
--color-sonata-500: #6d8b9c;
--color-sonata-600: #5c7684;
--color-sonata-700: #4a5e69;
--color-sonata-800: #35454d;
--color-sonata-900: #243036;
--color-sonata-950: #131c21;
}SCSS
$sonata: #abc8d8;
$sonata-rgb: 171, 200, 216;
$sonata-light: mix(#fff, $sonata, 20%);
$sonata-dark: mix(#000, $sonata, 20%);
.element {
color: $sonata;
box-shadow: 0 0 0 2px rgba($sonata, 0.35);
}