Adlandırılmış renk · #6AB2CA
Delicate Girl Blue
Delicate Girl Blue, #6AB2CA: rgb(106 178 202), hsl(195 48% 60%), oklch(0.725 0.08 221.5). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Cyan mean? → · Delicate Girl Blue color name →
#6AB2CA
oklch(0.725 0.08 221.5)
Renk dönüşümleri
- HEX
- #6ab2ca
- RGB
- rgb(106 178 202)
- HSL
- hsl(195 48% 60%)
- HWB
- hwb(195 42% 21%)
- OKLCH
- oklch(0.725 0.08 221.5)
- OKLab
- oklab(0.725 -0.06 -0.053)
- CIE Lab
- lab(68.54 -18.64 -19.68)
- LCH
- lch(68.54 27.11 226.6)
- CMYK
- cmyk(48% 12% 0% 21%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 7ABACF
- 89C1D5
- 99C9DA
- A7D1DF
- B6D8E5
- C5E0EA
- D3E8EF
- E2F0F5
- F0F7FA
Koyu tonlar
- 5B9AAF
- 4D8395
- 3F6D7C
- 315764
- 24434D
- 182F37
- 0D1D22
- 040C0F
- 000102
Gri tonlar
- 6EADC2
- 71A8BB
- 74A3B3
- 769EAC
- 7899A5
- 7A949D
- 7C8F96
- 7E8A8F
- 7F8587
Renk uyumları
Tamamlayıcı +180°
- 6AB2CA
Delicate Girl Blue
- D2967F
≈ Tropical Blooms
Analog -30° +30°
- 6AB2CA
Delicate Girl Blue
- 65B7B3
≈ Veranda Blue
- 81AAD7
≈ High Seas
Üçlü +120° +240°
- 6AB2CA
Delicate Girl Blue
- CA93B5
≈ Bossy-Pants Pink
- B0A86C
≈ Natchez Moss
Bölünmüş tamamlayıcı +150° +210°
- 6AB2CA
Delicate Girl Blue
- D39299
≈ Bridal Rose
- C69E6E
≈ Hazed Nuts
Dörtlü +90° +180° +270°
- 6AB2CA
Delicate Girl Blue
- B798CB
≈ Amethyst Show
- D2967F
≈ Tropical Blooms
- 94B17C
≈ Watercolour Green
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.37:1 · APCA Lc 47
Ag
AAASiyah üzerinde
WCAG 8.83:1 · APCA Lc 55
En iyi metin rengi: #000000
WCAG 8.83:1 (AAA) · APCA Lc 55
Contrast pairs
Kod parçacıkları
CSS
:root {
--delicate-girl-blue: #6ab2ca;
--delicate-girl-blue-rgb: 106 178 202;
--delicate-girl-blue-oklch: oklch(0.725 0.08 221.5);
}
.element {
color: var(--delicate-girl-blue);
background-color: hsl(195 48% 60%);
border-color: oklch(0.725 0.08 221.5);
}Tailwind CSS v4
@theme {
--color-delicate-girl-blue: #6ab2ca;
--color-delicate-girl-blue-50: #defbff;
--color-delicate-girl-blue-100: #cceefc;
--color-delicate-girl-blue-200: #b0dcee;
--color-delicate-girl-blue-300: #8ac1d6;
--color-delicate-girl-blue-400: #66aac0;
--color-delicate-girl-blue-500: #4092ac;
--color-delicate-girl-blue-600: #377c91;
--color-delicate-girl-blue-700: #2c6374;
--color-delicate-girl-blue-800: #1d4955;
--color-delicate-girl-blue-900: #13333c;
--color-delicate-girl-blue-950: #051e25;
}SCSS
$delicate-girl-blue: #6ab2ca;
$delicate-girl-blue-rgb: 106, 178, 202;
$delicate-girl-blue-light: mix(#fff, $delicate-girl-blue, 20%);
$delicate-girl-blue-dark: mix(#000, $delicate-girl-blue, 20%);
.element {
color: $delicate-girl-blue;
box-shadow: 0 0 0 2px rgba($delicate-girl-blue, 0.35);
}