Cor nomeada · #CFB49E
Bauhaus Buff
Bauhaus Buff é #CFB49E: rgb(207 180 158), hsl(27 34% 72%), oklch(0.787 0.044 61.3). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Bauhaus Buff color name →
#CFB49E
oklch(0.787 0.044 61.3)
Conversões de cor
- HEX
- #cfb49e
- RGB
- rgb(207 180 158)
- HSL
- hsl(27 34% 72%)
- HWB
- hwb(27 62% 19%)
- OKLCH
- oklch(0.787 0.044 61.3)
- OKLab
- oklab(0.787 0.021 0.038)
- CIE Lab
- lab(75.25 7.52 15.03)
- LCH
- lch(75.25 16.8 63.4)
- CMYK
- cmyk(0% 13% 24% 19%)
Tons claros · Sombras · Tons
Tons claros
- D4BBA7
- D9C3B1
- DDCABB
- E2D2C4
- E7D9CE
- ECE1D8
- F1E8E1
- F5F0EB
- FAF7F5
Sombras
- B49C89
- 998574
- 7F6E60
- 67584D
- 4F443A
- 383029
- 231D18
- 100C09
- 020201
Tons
- C7AF9B
- BFA998
- B7A495
- AF9F92
- A79A8F
- 9F958C
- 978F89
- 8F8A86
- 888583
Harmonias de cor
Complementar +180°
- CFB49E
Bauhaus Buff
- A2BED4
≈ Angel Falls
Análoga -30° +30°
- CFB49E
Bauhaus Buff
- D4B0A9
≈ Victoriana
- C4B99B
≈ Good to Grow
Tríade +120° +240°
- CFB49E
Bauhaus Buff
- 9CC3BB
≈ Pitter Patter
- BEB4D2
≈ Frosted Orchid
Complementar dividida +150° +210°
- CFB49E
Bauhaus Buff
- 9AC2CA
≈ Aquatic
- AFB9D6
≈ Halogen Blue
Tétrade +90° +180° +270°
- CFB49E
Bauhaus Buff
- A6C2AC
≈ Spring Leaves
- A2BED4
≈ Angel Falls
- CBB0C7
≈ Winsome Orchid
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.96:1 · APCA Lc 38
Ag
AAASobre preto
WCAG 10.67:1 · APCA Lc 64
Melhor cor de texto: #000000
WCAG 10.67:1 (AAA) · APCA Lc 64
Contrast pairs
Trechos de código
CSS
:root {
--bauhaus-buff: #cfb49e;
--bauhaus-buff-rgb: 207 180 158;
--bauhaus-buff-oklch: oklch(0.787 0.044 61.3);
}
.element {
color: var(--bauhaus-buff);
background-color: hsl(27 34% 72%);
border-color: oklch(0.787 0.044 61.3);
}Tailwind CSS v4
@theme {
--color-bauhaus-buff: #cfb49e;
--color-bauhaus-buff-50: #fff3e9;
--color-bauhaus-buff-100: #f3e5d9;
--color-bauhaus-buff-200: #e2d1c2;
--color-bauhaus-buff-300: #c8b3a1;
--color-bauhaus-buff-400: #b29985;
--color-bauhaus-buff-500: #9c8069;
--color-bauhaus-buff-600: #846c59;
--color-bauhaus-buff-700: #6a5747;
--color-bauhaus-buff-800: #4e3f33;
--color-bauhaus-buff-900: #362b23;
--color-bauhaus-buff-950: #211912;
}SCSS
$bauhaus-buff: #cfb49e;
$bauhaus-buff-rgb: 207, 180, 158;
$bauhaus-buff-light: mix(#fff, $bauhaus-buff, 20%);
$bauhaus-buff-dark: mix(#000, $bauhaus-buff, 20%);
.element {
color: $bauhaus-buff;
box-shadow: 0 0 0 2px rgba($bauhaus-buff, 0.35);
}