Nazwany kolor · #BBAFC1
Courtly Purple
Courtly Purple to #BBAFC1: rgb(187 175 193), hsl(280 13% 72%), oklch(0.77 0.029 314.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Courtly Purple color name →
#BBAFC1
oklch(0.77 0.029 314.6)
Konwersje koloru
- HEX
- #bbafc1
- RGB
- rgb(187 175 193)
- HSL
- hsl(280 13% 72%)
- HWB
- hwb(280 69% 24%)
- OKLCH
- oklch(0.77 0.029 314.6)
- OKLab
- oklab(0.77 0.02 -0.02)
- CIE Lab
- lab(72.91 6.93 -7.58)
- LCH
- lch(72.91 10.27 312.4)
- CMYK
- cmyk(3% 9% 0% 24%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C2B7C7
- C8BFCD
- CFC6D3
- D6CED9
- DDD6E0
- E3DEE6
- EAE6EC
- F1EFF2
- F8F7F9
Odcienie ciemniejsze
- A298A7
- 8A818F
- 736B77
- 5C565F
- 464149
- 322E34
- 1F1C20
- 0D0B0E
- 020102
Tony
- B5AABA
- AFA5B4
- A9A1AD
- A39CA6
- 9D97A0
- 979399
- 918E93
- 8B898D
- 868586
Harmonie kolorów
Komplementarna +180°
- BBAFC1
Courtly Purple
- ADB8A6
≈ Graceful Green
Analogowa -30° +30°
- BBAFC1
Courtly Purple
- B2B2C6
≈ Filtered Light
- C2ADB8
≈ Breathtaking Evening
Triada +120° +240°
- BBAFC1
Courtly Purple
- BFB2A1
≈ Balanced Beige
- A0BAB9
≈ Festoon Aqua
Komplementarna rozszczepiona +150° +210°
- BBAFC1
Courtly Purple
- B6B5A1
≈ Turtle Trail
- A4BAAF
≈ Silt Green
Tetrada +90° +180° +270°
- BBAFC1
Courtly Purple
- C5AFA6
≈ Glamorous Taupe
- ADB8A6
≈ Graceful Green
- A2B8C2
≈ Sterling Blue
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.09:1 · APCA Lc 41
Ag
AAANa czerni
WCAG 10.01:1 · APCA Lc 61
Najlepszy kolor tekstu: #000000
WCAG 10.01:1 (AAA) · APCA Lc 61
Contrast pairs
Fragmenty kodu
CSS
:root {
--courtly-purple: #bbafc1;
--courtly-purple-rgb: 187 175 193;
--courtly-purple-oklch: oklch(0.77 0.029 314.6);
}
.element {
color: var(--courtly-purple);
background-color: hsl(280 13% 72%);
border-color: oklch(0.77 0.029 314.6);
}Tailwind CSS v4
@theme {
--color-courtly-purple: #bbafc1;
--color-courtly-purple-50: #f8f3fb;
--color-courtly-purple-100: #ece5ee;
--color-courtly-purple-200: #d9d1dd;
--color-courtly-purple-300: #bdb3c1;
--color-courtly-purple-400: #a59aaa;
--color-courtly-purple-500: #8d8194;
--color-courtly-purple-600: #786d7d;
--color-courtly-purple-700: #605764;
--color-courtly-purple-800: #46404a;
--color-courtly-purple-900: #302c33;
--color-courtly-purple-950: #1d191f;
}SCSS
$courtly-purple: #bbafc1;
$courtly-purple-rgb: 187, 175, 193;
$courtly-purple-light: mix(#fff, $courtly-purple, 20%);
$courtly-purple-dark: mix(#000, $courtly-purple, 20%);
.element {
color: $courtly-purple;
box-shadow: 0 0 0 2px rgba($courtly-purple, 0.35);
}