Color con nombre · #BFC0AA
Sweet Clover
Sweet Clover es #BFC0AA: rgb(191 192 170), hsl(63 15% 71%), oklch(0.801 0.03 109.2). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Sweet Clover color name →
#BFC0AA
oklch(0.801 0.03 109.2)
Conversiones de color
- HEX
- #bfc0aa
- RGB
- rgb(191 192 170)
- HSL
- hsl(63 15% 71%)
- HWB
- hwb(63 67% 25%)
- OKLCH
- oklch(0.801 0.03 109.2)
- OKLab
- oklab(0.801 -0.01 0.029)
- CIE Lab
- lab(77.17 -3.23 11.02)
- LCH
- lch(77.17 11.48 106.3)
- CMYK
- cmyk(1% 0% 11% 25%)
Tintes · Sombras · Tonos
Tintes
- C5C6B2
- CBCCBB
- D2D3C3
- D8D9CB
- DFDFD4
- E5E5DC
- EBECE5
- F2F2EE
- F8F9F6
Sombras
- A6A793
- 8D8E7D
- 757668
- 5E5F53
- 48493F
- 33342D
- 1F201B
- 0D0E0B
- 020201
Tonos
- B8B9A6
- B2B3A2
- ACAC9D
- A5A699
- 9F9F95
- 999991
- 92938C
- 8C8C88
- 868684
Armonías de color
Complementario +180°
- BFC0AA
Sweet Clover
- BDBBD1
≈ Twilight Pearl
Análogo -30° +30°
- BFC0AA
Sweet Clover
- C9BCA9
≈ Attic Linen
- B4C3B1
≈ Rainee
Triádico +120° +240°
- BFC0AA
Sweet Clover
- ABC2CE
≈ Ruffled Feathers
- CEB7C1
≈ Blobfish
Complementario dividido +150° +210°
- BFC0AA
Sweet Clover
- B3BFD2
≈ Snow Flurries
- C7B8CB
≈ Softly Softly
Tetrádico +90° +180° +270°
- BFC0AA
Sweet Clover
- A8C4C5
≈ Blende Blue
- BDBBD1
≈ Twilight Pearl
- D1B7B6
≈ Smoked Lavender
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.85:1 · APCA Lc 35
Ag
AAASobre negro
WCAG 11.33:1 · APCA Lc 68
Mejor color de texto: #000000
WCAG 11.33:1 (AAA) · APCA Lc 68
Contrast pairs
Fragmentos de código
CSS
:root {
--sweet-clover: #bfc0aa;
--sweet-clover-rgb: 191 192 170;
--sweet-clover-oklch: oklch(0.801 0.03 109.2);
}
.element {
color: var(--sweet-clover);
background-color: hsl(63 15% 71%);
border-color: oklch(0.801 0.03 109.2);
}Tailwind CSS v4
@theme {
--color-sweet-clover: #bfc0aa;
--color-sweet-clover-50: #f5f6ec;
--color-sweet-clover-100: #e8e9de;
--color-sweet-clover-200: #d4d6c7;
--color-sweet-clover-300: #b8b9a8;
--color-sweet-clover-400: #9fa08c;
--color-sweet-clover-500: #878871;
--color-sweet-clover-600: #727360;
--color-sweet-clover-700: #5c5c4d;
--color-sweet-clover-800: #434337;
--color-sweet-clover-900: #2e2e26;
--color-sweet-clover-950: #1b1b14;
}SCSS
$sweet-clover: #bfc0aa;
$sweet-clover-rgb: 191, 192, 170;
$sweet-clover-light: mix(#fff, $sweet-clover, 20%);
$sweet-clover-dark: mix(#000, $sweet-clover, 20%);
.element {
color: $sweet-clover;
box-shadow: 0 0 0 2px rgba($sweet-clover, 0.35);
}