Adlandırılmış renk · #BBCCDD
Arctic Grey
Arctic Grey, #BBCCDD: rgb(187 204 221), hsl(210 33% 80%), oklch(0.838 0.03 248.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Arctic Grey color name →
#BBCCDD
oklch(0.838 0.03 248.2)
Renk dönüşümleri
- HEX
- #bbccdd
- RGB
- rgb(187 204 221)
- HSL
- hsl(210 33% 80%)
- HWB
- hwb(210 73% 13%)
- OKLCH
- oklch(0.838 0.03 248.2)
- OKLab
- oklab(0.838 -0.011 -0.028)
- CIE Lab
- lab(81.14 -3.38 -10.54)
- LCH
- lch(81.14 11.06 252.2)
- CMYK
- cmyk(15% 8% 0% 13%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- C2D1E0
- C8D6E4
- CFDBE7
- D6E0EB
- DDE5EE
- E3EAF1
- EAF0F5
- F1F5F8
- F8FAFC
Koyu tonlar
- A2B1C0
- 8A97A4
- 737E88
- 5C656E
- 464E55
- 32373D
- 1F2226
- 0D0F11
- 020202
Gri tonlar
- B5C4D3
- AFBCCA
- A9B5C0
- A3ADB7
- 9DA5AD
- 979EA4
- 91969B
- 8C8F92
- 868789
Renk uyumları
Tamamlayıcı +180°
- BBCCDD
Arctic Grey
- D7C7B5
≈ Dry Creek
Analog -30° +30°
- BBCCDD
Arctic Grey
- B5CFD7
≈ Midsummer’s Dream
- C5C8DE
≈ Silver Sweetpea
Üçlü +120° +240°
- BBCCDD
Arctic Grey
- DCC2C6
≈ Bunny Pink
- C4CEB9
≈ Mellow Spring
Bölünmüş tamamlayıcı +150° +210°
- BBCCDD
Arctic Grey
- DCC4BC
≈ Shell
- CFCAB4
≈ Skipping Stone
Dörtlü +90° +180° +270°
- BBCCDD
Arctic Grey
- D8C3D1
≈ Mauve Organdie
- D7C7B5
≈ Dry Creek
- BAD0C2
≈ Spray of Mint
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.64:1 · APCA Lc 28
Ag
AAASiyah üzerinde
WCAG 12.79:1 · APCA Lc 74
En iyi metin rengi: #000000
WCAG 12.79:1 (AAA) · APCA Lc 74
Contrast pairs
Kod parçacıkları
CSS
:root {
--arctic-grey: #bbccdd;
--arctic-grey-rgb: 187 204 221;
--arctic-grey-oklch: oklch(0.838 0.03 248.2);
}
.element {
color: var(--arctic-grey);
background-color: hsl(210 33% 80%);
border-color: oklch(0.838 0.03 248.2);
}Tailwind CSS v4
@theme {
--color-arctic-grey: #bbccdd;
--color-arctic-grey-50: #eff6fe;
--color-arctic-grey-100: #e1e9f2;
--color-arctic-grey-200: #cbd6e1;
--color-arctic-grey-300: #acb9c7;
--color-arctic-grey-400: #91a0b0;
--color-arctic-grey-500: #77889a;
--color-arctic-grey-600: #657382;
--color-arctic-grey-700: #505c68;
--color-arctic-grey-800: #3a444c;
--color-arctic-grey-900: #282f35;
--color-arctic-grey-950: #161b20;
}SCSS
$arctic-grey: #bbccdd;
$arctic-grey-rgb: 187, 204, 221;
$arctic-grey-light: mix(#fff, $arctic-grey, 20%);
$arctic-grey-dark: mix(#000, $arctic-grey, 20%);
.element {
color: $arctic-grey;
box-shadow: 0 0 0 2px rgba($arctic-grey, 0.35);
}