Nazwany kolor · #B4A5A0
Lavender Suede
Lavender Suede to #B4A5A0: rgb(180 165 160), hsl(15 12% 67%), oklch(0.733 0.019 39.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Lavender Suede color name →
#B4A5A0
oklch(0.733 0.019 39.4)
Konwersje koloru
- HEX
- #b4a5a0
- RGB
- rgb(180 165 160)
- HSL
- hsl(15 12% 67%)
- HWB
- hwb(15 63% 29%)
- OKLCH
- oklch(0.733 0.019 39.4)
- OKLab
- oklab(0.733 0.015 0.012)
- CIE Lab
- lab(68.94 4.98 4.67)
- LCH
- lch(68.94 6.83 43.2)
- CMYK
- cmyk(0% 8% 11% 29%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- BBAEA9
- C3B6B2
- CABFBC
- D2C8C5
- D9D1CF
- E1DAD8
- E8E3E2
- F0ECEB
- F7F6F5
Odcienie ciemniejsze
- 9C8F8B
- 857976
- 6E6561
- 58514E
- 443D3B
- 302B29
- 1D1A19
- 0C0A09
- 020101
Tony
- AFA19D
- A99D9A
- A49A96
- 9F9693
- 9A9290
- 958F8D
- 8F8B89
- 8A8786
- 858483
Harmonie kolorów
Komplementarna +180°
- B4A5A0
Lavender Suede
- 9CACB1
≈ Pelican Bay
Analogowa -30° +30°
- B4A5A0
Lavender Suede
- B4A4A6
≈ Cool Lavender
- B1A79C
≈ Ashen Grey
Triada +120° +240°
- B4A5A0
Lavender Suede
- 9FADA4
≈ Tower Grey
- A6A8B5
≈ Mischka
Komplementarna rozszczepiona +150° +210°
- B4A5A0
Lavender Suede
- 9CADAB
≈ April Rain
- A0AAB4
≈ Chateau de Chillon
Tetrada +90° +180° +270°
- B4A5A0
Lavender Suede
- A5AB9F
≈ Gracious Grey
- 9CACB1
≈ Pelican Bay
- ACA6B2
≈ Palace Walls
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.37:1 · APCA Lc 47
Ag
AAANa czerni
WCAG 8.83:1 · APCA Lc 55
Najlepszy kolor tekstu: #000000
WCAG 8.83:1 (AAA) · APCA Lc 55
Contrast pairs
Fragmenty kodu
CSS
:root {
--lavender-suede: #b4a5a0;
--lavender-suede-rgb: 180 165 160;
--lavender-suede-oklch: oklch(0.733 0.019 39.4);
}
.element {
color: var(--lavender-suede);
background-color: hsl(15 12% 67%);
border-color: oklch(0.733 0.019 39.4);
}Tailwind CSS v4
@theme {
--color-lavender-suede: #b4a5a0;
--color-lavender-suede-50: #faf3f1;
--color-lavender-suede-100: #eee6e3;
--color-lavender-suede-200: #dcd2ce;
--color-lavender-suede-300: #c0b4b0;
--color-lavender-suede-400: #a99b96;
--color-lavender-suede-500: #92827d;
--color-lavender-suede-600: #7b6e6a;
--color-lavender-suede-700: #635855;
--color-lavender-suede-800: #49403e;
--color-lavender-suede-900: #322c2a;
--color-lavender-suede-950: #1e1918;
}SCSS
$lavender-suede: #b4a5a0;
$lavender-suede-rgb: 180, 165, 160;
$lavender-suede-light: mix(#fff, $lavender-suede, 20%);
$lavender-suede-dark: mix(#000, $lavender-suede, 20%);
.element {
color: $lavender-suede;
box-shadow: 0 0 0 2px rgba($lavender-suede, 0.35);
}