Nazwany kolor · #BBB09B
Townhouse Taupe
Townhouse Taupe to #BBB09B: rgb(187 176 155), hsl(39 19% 67%), oklch(0.761 0.032 83.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Townhouse Taupe color name →
#BBB09B
oklch(0.761 0.032 83.6)
Konwersje koloru
- HEX
- #bbb09b
- RGB
- rgb(187 176 155)
- HSL
- hsl(39 19% 67%)
- HWB
- hwb(39 61% 27%)
- OKLCH
- oklch(0.761 0.032 83.6)
- OKLab
- oklab(0.761 0.004 0.032)
- CIE Lab
- lab(72.34 1.46 12.29)
- LCH
- lch(72.34 12.38 83.2)
- CMYK
- cmyk(0% 6% 17% 27%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C2B8A5
- C8BFAE
- CFC7B8
- D6CFC2
- DDD7CC
- E3DFD6
- EAE7E0
- F1EFEA
- F8F7F5
Odcienie ciemniejsze
- A29986
- 8A8272
- 736C5E
- 5C564B
- 464239
- 322E28
- 1F1C18
- 0D0B09
- 020101
Tony
- B5AB98
- AFA696
- A9A193
- A39D90
- 9D988E
- 97938B
- 918E88
- 8B8985
- 868583
Harmonie kolorów
Komplementarna +180°
- BBB09B
Townhouse Taupe
- A7B2C6
≈ Silk Sox
Analogowa -30° +30°
- BBB09B
Townhouse Taupe
- C2AC9F
≈ Bamboo Beige
- B1B49D
≈ White Cabbage
Triada +120° +240°
- BBB09B
Townhouse Taupe
- 9BB8BA
≈ Windswept Clouds
- BCABBD
≈ Lavender Frost
Komplementarna rozszczepiona +150° +210°
- BBB09B
Townhouse Taupe
- 9EB5C3
≈ Faded Flaxflower
- B2AEC4
≈ Wisteria Trellis
Tetrada +90° +180° +270°
- BBB09B
Townhouse Taupe
- 9EB8AF
≈ Tropical Bay
- A7B2C6
≈ Silk Sox
- C3A9B3
≈ Breathtaking Evening
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.14:1 · APCA Lc 42
Ag
AAANa czerni
WCAG 9.79:1 · APCA Lc 60
Najlepszy kolor tekstu: #000000
WCAG 9.79:1 (AAA) · APCA Lc 60
Contrast pairs
Fragmenty kodu
CSS
:root {
--townhouse-taupe: #bbb09b;
--townhouse-taupe-rgb: 187 176 155;
--townhouse-taupe-oklch: oklch(0.761 0.032 83.6);
}
.element {
color: var(--townhouse-taupe);
background-color: hsl(39 19% 67%);
border-color: oklch(0.761 0.032 83.6);
}Tailwind CSS v4
@theme {
--color-townhouse-taupe: #bbb09b;
--color-townhouse-taupe-50: #f9f5eb;
--color-townhouse-taupe-100: #ede7dc;
--color-townhouse-taupe-200: #dad4c5;
--color-townhouse-taupe-300: #bfb7a5;
--color-townhouse-taupe-400: #a79d8a;
--color-townhouse-taupe-500: #90856f;
--color-townhouse-taupe-600: #7a705e;
--color-townhouse-taupe-700: #625a4b;
--color-townhouse-taupe-800: #484136;
--color-townhouse-taupe-900: #322d25;
--color-townhouse-taupe-950: #1e1a14;
}SCSS
$townhouse-taupe: #bbb09b;
$townhouse-taupe-rgb: 187, 176, 155;
$townhouse-taupe-light: mix(#fff, $townhouse-taupe, 20%);
$townhouse-taupe-dark: mix(#000, $townhouse-taupe, 20%);
.element {
color: $townhouse-taupe;
box-shadow: 0 0 0 2px rgba($townhouse-taupe, 0.35);
}