En yakın adlandırılmış renk · #9AB6D5
#9AB6D5
En yakın adlandırılmış renk: Blues White Shoes
#9AB6D5 (rgb(154 182 213), hsl(212 41% 72%), oklch(0.766 0.054 251.2)) en çok Blues White Shoes adlı renge yakındır. Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
#9AB6D5
oklch(0.766 0.054 251.2)
Renk dönüşümleri
- HEX
- #9ab6d5
- RGB
- rgb(154 182 213)
- HSL
- hsl(212 41% 72%)
- HWB
- hwb(212 60% 16%)
- OKLCH
- oklch(0.766 0.054 251.2)
- OKLab
- oklab(0.766 -0.018 -0.051)
- CIE Lab
- lab(72.73 -4.58 -19.04)
- LCH
- lch(72.73 19.58 256.5)
- CMYK
- cmyk(28% 15% 0% 16%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- A4BDD9
- AEC4DE
- B8CCE2
- C2D3E6
- CCDAEA
- D6E1EE
- E0E9F3
- EAF0F7
- F5F8FB
Koyu tonlar
- 859EB9
- 71869E
- 5E6F83
- 4B596A
- 394451
- 27303A
- 171D24
- 090C10
- 010202
Gri tonlar
- 97B1CC
- 95ABC4
- 92A6BB
- 90A0B2
- 8D9BAA
- 8B95A1
- 889099
- 858B91
- 838588
Renk uyumları
Tamamlayıcı +180°
- 9AB6D5
Blues White Shoes
- C9AE8E
≈ Spanish Sand
Analog -30° +30°
- 9AB6D5
Blues White Shoes
- 8DBBCC
≈ Blue Echo
- ACB0D5
≈ Lavender Wash
Üçlü +120° +240°
- 9AB6D5
Blues White Shoes
- D3A5AA
≈ Foxy Lady
- A7BB97
≈ Ash Tree
Bölünmüş tamamlayıcı +150° +210°
- 9AB6D5
Blues White Shoes
- D2A899
≈ Pink Ginger
- BAB58D
≈ Coriander
Dörtlü +90° +180° +270°
- 9AB6D5
Blues White Shoes
- CCA6BD
≈ Safflower Wisteria
- C9AE8E
≈ Spanish Sand
- 95BEA8
≈ Scenic View
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.09:1 · APCA Lc 41
Ag
AAASiyah üzerinde
WCAG 10.02:1 · APCA Lc 61
En iyi metin rengi: #000000
WCAG 10.02:1 (AAA) · APCA Lc 61
Contrast pairs
Kod parçacıkları
CSS
:root {
--blues-white-shoes: #9ab6d5;
--blues-white-shoes-rgb: 154 182 213;
--blues-white-shoes-oklch: oklch(0.766 0.054 251.2);
}
.element {
color: var(--blues-white-shoes);
background-color: hsl(212 41% 72%);
border-color: oklch(0.766 0.054 251.2);
}Tailwind CSS v4
@theme {
--color-blues-white-shoes: #9ab6d5;
--color-blues-white-shoes-50: #ebf6ff;
--color-blues-white-shoes-100: #dce9fa;
--color-blues-white-shoes-200: #c5d6ec;
--color-blues-white-shoes-300: #a4bad3;
--color-blues-white-shoes-400: #87a1be;
--color-blues-white-shoes-500: #6c89a9;
--color-blues-white-shoes-600: #5b748f;
--color-blues-white-shoes-700: #495d73;
--color-blues-white-shoes-800: #344455;
--color-blues-white-shoes-900: #232f3b;
--color-blues-white-shoes-950: #121c25;
}SCSS
$blues-white-shoes: #9ab6d5;
$blues-white-shoes-rgb: 154, 182, 213;
$blues-white-shoes-light: mix(#fff, $blues-white-shoes, 20%);
$blues-white-shoes-dark: mix(#000, $blues-white-shoes, 20%);
.element {
color: $blues-white-shoes;
box-shadow: 0 0 0 2px rgba($blues-white-shoes, 0.35);
}