Nazwany kolor · #8FAACA
Bachelor Blue
Bachelor Blue to #8FAACA: rgb(143 170 202), hsl(213 36% 68%), oklch(0.729 0.055 252.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Blue mean? → · Bachelor Blue color name →
#8FAACA
oklch(0.729 0.055 252.9)
Konwersje koloru
- HEX
- #8faaca
- RGB
- rgb(143 170 202)
- HSL
- hsl(213 36% 68%)
- HWB
- hwb(213 56% 21%)
- OKLCH
- oklch(0.729 0.055 252.9)
- OKLab
- oklab(0.729 -0.016 -0.053)
- CIE Lab
- lab(68.39 -4.04 -19.65)
- LCH
- lch(68.39 20.06 258.4)
- CMYK
- cmyk(29% 16% 0% 21%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 9AB2CF
- A5BBD5
- B0C3DA
- BBCBDF
- C6D4E5
- D1DCEA
- DDE5EF
- E8EEF5
- F3F6FA
Odcienie ciemniejsze
- 7C93AF
- 697D95
- 57687C
- 455364
- 343F4D
- 242D37
- 151B22
- 070B0F
- 010102
Tony
- 8EA6C2
- 8CA2BB
- 8B9DB3
- 8999AC
- 8895A5
- 86919D
- 858D96
- 83888F
- 828487
Harmonie kolorów
Komplementarna +180°
- 8FAACA
Bachelor Blue
- BDA281
≈ With the Grain
Analogowa -30° +30°
- 8FAACA
Bachelor Blue
- 81B0C1
≈ Resolute Blue
- A2A3CA
≈ Venus Flower
Triada +120° +240°
- 8FAACA
Bachelor Blue
- C89A9D
≈ Twice Shy
- 9AAF8C
≈ Cardoon
Komplementarna rozszczepiona +150° +210°
- 8FAACA
Bachelor Blue
- C69D8C
≈ Whistler Rose
- ADA981
≈ Green Grey Mist
Tetrada +90° +180° +270°
- 8FAACA
Bachelor Blue
- C19AB1
≈ Lily
- BDA281
≈ With the Grain
- 88B39D
≈ Holly Fern
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.39:1 · APCA Lc 47
Ag
AAANa czerni
WCAG 8.77:1 · APCA Lc 55
Najlepszy kolor tekstu: #000000
WCAG 8.77:1 (AAA) · APCA Lc 55
Contrast pairs
Fragmenty kodu
CSS
:root {
--bachelor-blue: #8faaca;
--bachelor-blue-rgb: 143 170 202;
--bachelor-blue-oklch: oklch(0.729 0.055 252.9);
}
.element {
color: var(--bachelor-blue);
background-color: hsl(213 36% 68%);
border-color: oklch(0.729 0.055 252.9);
}Tailwind CSS v4
@theme {
--color-bachelor-blue: #8faaca;
--color-bachelor-blue-50: #ebf6ff;
--color-bachelor-blue-100: #dce9fb;
--color-bachelor-blue-200: #c5d6ec;
--color-bachelor-blue-300: #a5b9d4;
--color-bachelor-blue-400: #88a1bf;
--color-bachelor-blue-500: #6c89ab;
--color-bachelor-blue-600: #5c7490;
--color-bachelor-blue-700: #495d74;
--color-bachelor-blue-800: #344455;
--color-bachelor-blue-900: #232f3b;
--color-bachelor-blue-950: #121b25;
}SCSS
$bachelor-blue: #8faaca;
$bachelor-blue-rgb: 143, 170, 202;
$bachelor-blue-light: mix(#fff, $bachelor-blue, 20%);
$bachelor-blue-dark: mix(#000, $bachelor-blue, 20%);
.element {
color: $bachelor-blue;
box-shadow: 0 0 0 2px rgba($bachelor-blue, 0.35);
}