Adlandırılmış renk · #BAB3CB
Violet Beauty
Violet Beauty, #BAB3CB: rgb(186 179 203), hsl(258 19% 75%), oklch(0.78 0.035 298.9). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Violet Beauty color name →
#BAB3CB
oklch(0.78 0.035 298.9)
Renk dönüşümleri
- HEX
- #bab3cb
- RGB
- rgb(186 179 203)
- HSL
- hsl(258 19% 75%)
- HWB
- hwb(258 70% 20%)
- OKLCH
- oklch(0.78 0.035 298.9)
- OKLab
- oklab(0.78 0.017 -0.03)
- CIE Lab
- lab(74.1 6.01 -11.27)
- LCH
- lch(74.1 12.77 298.1)
- CMYK
- cmyk(8% 12% 0% 20%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- C1BAD0
- C7C2D5
- CEC9DB
- D5D1E0
- DCD8E5
- E3E0EA
- EAE8EF
- F1EFF5
- F8F7FA
Koyu tonlar
- A19BB0
- 898496
- 726E7D
- 5C5865
- 46434D
- 322F37
- 1E1D22
- 0D0C0F
- 020102
Gri tonlar
- B4AEC3
- AEA9BC
- A8A3B4
- A29EAC
- 9C99A5
- 97949D
- 918F96
- 8B8A8F
- 868587
Renk uyumları
Tamamlayıcı +180°
- BAB3CB
Violet Beauty
- B5BBA2
≈ Tickled Crow
Analog -30° +30°
- BAB3CB
Violet Beauty
- AEB7CE
≈ Ethereal Mist
- C4B0C2
≈ Really Romantic
Üçlü +120° +240°
- BAB3CB
Violet Beauty
- C9B3A2
≈ Familiar Beige
- A1BFB8
≈ Botanical Bliss
Bölünmüş tamamlayıcı +150° +210°
- BAB3CB
Violet Beauty
- C0B79F
≈ Wagon Wheel
- A9BEAC
≈ Young Gecko
Dörtlü +90° +180° +270°
- BAB3CB
Violet Beauty
- CDB0AB
≈ Garden Snail
- B5BBA2
≈ Tickled Crow
- 9FBEC3
≈ Warm Breezes
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.01:1 · APCA Lc 39
Ag
AAASiyah üzerinde
WCAG 10.39:1 · APCA Lc 63
En iyi metin rengi: #000000
WCAG 10.39:1 (AAA) · APCA Lc 63
Contrast pairs
Kod parçacıkları
CSS
:root {
--violet-beauty: #bab3cb;
--violet-beauty-rgb: 186 179 203;
--violet-beauty-oklch: oklch(0.78 0.035 298.9);
}
.element {
color: var(--violet-beauty);
background-color: hsl(258 19% 75%);
border-color: oklch(0.78 0.035 298.9);
}Tailwind CSS v4
@theme {
--color-violet-beauty: #bab3cb;
--color-violet-beauty-50: #f7f3fe;
--color-violet-beauty-100: #eae5f2;
--color-violet-beauty-200: #d6d1e1;
--color-violet-beauty-300: #bab4c7;
--color-violet-beauty-400: #a19ab1;
--color-violet-beauty-500: #89829a;
--color-violet-beauty-600: #746e83;
--color-violet-beauty-700: #5d5869;
--color-violet-beauty-800: #43404d;
--color-violet-beauty-900: #2f2c36;
--color-violet-beauty-950: #1b1921;
}SCSS
$violet-beauty: #bab3cb;
$violet-beauty-rgb: 186, 179, 203;
$violet-beauty-light: mix(#fff, $violet-beauty, 20%);
$violet-beauty-dark: mix(#000, $violet-beauty, 20%);
.element {
color: $violet-beauty;
box-shadow: 0 0 0 2px rgba($violet-beauty, 0.35);
}