Nazwany kolor · #A2BAD2
Blue Horror
Blue Horror to #A2BAD2: rgb(162 186 210), hsl(210 35% 73%), oklch(0.779 0.043 248.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Blue mean? → · Blue Horror color name →
#A2BAD2
oklch(0.779 0.043 248.4)
Konwersje koloru
- HEX
- #a2bad2
- RGB
- rgb(162 186 210)
- HSL
- hsl(210 35% 73%)
- HWB
- hwb(210 64% 18%)
- OKLCH
- oklch(0.779 0.043 248.4)
- OKLab
- oklab(0.779 -0.016 -0.04)
- CIE Lab
- lab(74.28 -4.55 -15.03)
- LCH
- lch(74.28 15.7 253.2)
- CMYK
- cmyk(23% 11% 0% 18%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- ABC1D7
- B4C8DB
- BDCEE0
- C7D5E4
- D0DCE9
- D9E3ED
- E3EAF2
- ECF1F6
- F5F8FB
Odcienie ciemniejsze
- 8CA1B6
- 77899B
- 637281
- 4F5C68
- 3C4650
- 2A3239
- 191E24
- 0A0D10
- 010202
Tony
- 9FB4CA
- 9BAEC1
- 98A8B9
- 94A2B1
- 919DA8
- 8E97A0
- 8A9198
- 878B90
- 838688
Harmonie kolorów
Komplementarna +180°
- A2BAD2
Blue Horror
- CAB29A
≈ Practical Beige
Analogowa -30° +30°
- A2BAD2
Blue Horror
- 99BECA
≈ Rest Assured
- B0B5D3
≈ Hundred Waters
Triada +120° +240°
- A2BAD2
Blue Horror
- D1ACB1
≈ Ballet Rose
- AFBDA0
≈ Jade Cameo
Komplementarna rozszczepiona +150° +210°
- A2BAD2
Blue Horror
- D1AEA3
≈ Rose Smoke
- BEB899
≈ Distant Valley
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.00:1 · APCA Lc 39
Ag
AAANa czerni
WCAG 10.49:1 · APCA Lc 64
Najlepszy kolor tekstu: #000000
WCAG 10.49:1 (AAA) · APCA Lc 64
Contrast pairs
Fragmenty kodu
CSS
:root {
--blue-horror: #a2bad2;
--blue-horror-rgb: 162 186 210;
--blue-horror-oklch: oklch(0.779 0.043 248.4);
}
.element {
color: var(--blue-horror);
background-color: hsl(210 35% 73%);
border-color: oklch(0.779 0.043 248.4);
}Tailwind CSS v4
@theme {
--color-blue-horror: #a2bad2;
--color-blue-horror-50: #ecf6ff;
--color-blue-horror-100: #dee9f6;
--color-blue-horror-200: #c7d6e7;
--color-blue-horror-300: #a7bacd;
--color-blue-horror-400: #8ba1b7;
--color-blue-horror-500: #7089a2;
--color-blue-horror-600: #5f7489;
--color-blue-horror-700: #4c5d6e;
--color-blue-horror-800: #364451;
--color-blue-horror-900: #252f38;
--color-blue-horror-950: #141c23;
}SCSS
$blue-horror: #a2bad2;
$blue-horror-rgb: 162, 186, 210;
$blue-horror-light: mix(#fff, $blue-horror, 20%);
$blue-horror-dark: mix(#000, $blue-horror, 20%);
.element {
color: $blue-horror;
box-shadow: 0 0 0 2px rgba($blue-horror, 0.35);
}