Color con nombre · #807697
Grape Harvest
Grape Harvest es #807697: rgb(128 118 151), hsl(258 14% 53%), oklch(0.587 0.051 298.7). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Purple mean? → · Grape Harvest color name →
#807697
oklch(0.587 0.051 298.7)
Conversiones de color
- HEX
- #807697
- RGB
- rgb(128 118 151)
- HSL
- hsl(258 14% 53%)
- HWB
- hwb(258 46% 41%)
- OKLCH
- oklch(0.587 0.051 298.7)
- OKLab
- oklab(0.587 0.024 -0.045)
- CIE Lab
- lab(51.46 9.18 -16.5)
- LCH
- lch(51.46 18.88 299.1)
- CMYK
- cmyk(15% 22% 0% 41%)
Tintes · Sombras · Tonos
Tintes
- 8C83A1
- 9890AB
- A49DB6
- B1ABC0
- BDB8CA
- CAC6D5
- D7D4DF
- E4E2EA
- F2F1F4
Sombras
- 6E6683
- 5D566F
- 4D475C
- 3D3849
- 2E2937
- 1F1C26
- 120F17
- 060508
- 010101
Tonos
- 807795
- 807893
- 807990
- 807A8E
- 807B8C
- 807C89
- 807D87
- 807E85
- 807F82
Armonías de color
Complementario +180°
- 807697
Grape Harvest
- 79815E
≈ Grape Vine
Análogo -30° +30°
- 807697
Grape Harvest
- 707C9B
≈ Infinity and Beyond
- 8E728C
≈ Very Grape
Triádico +120° +240°
- 807697
Grape Harvest
- 94755E
≈ Whisky Barrel
- 5A877D
≈ Wintergreen Dream
Complementario dividido +150° +210°
- 807697
Grape Harvest
- 897B59
≈ Woven Basket
- 68856C
≈ Christmas Holly
Tetrádico +90° +180° +270°
- 807697
Grape Harvest
- 98716B
≈ Antique Rose
- 79815E
≈ Grape Vine
- 57858C
≈ Night Masque
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 4.23:1 · APCA Lc 69
Ag
AASobre negro
WCAG 4.95:1 · APCA Lc 32
Mejor color de texto: #000000
WCAG 4.95:1 (AA) · APCA Lc 32
Contrast pairs
Fragmentos de código
CSS
:root {
--grape-harvest: #807697;
--grape-harvest-rgb: 128 118 151;
--grape-harvest-oklch: oklch(0.587 0.051 298.7);
}
.element {
color: var(--grape-harvest);
background-color: hsl(258 14% 53%);
border-color: oklch(0.587 0.051 298.7);
}Tailwind CSS v4
@theme {
--color-grape-harvest: #807697;
--color-grape-harvest-50: #f7f2ff;
--color-grape-harvest-100: #eae4f7;
--color-grape-harvest-200: #d7d0e7;
--color-grape-harvest-300: #bbb2ce;
--color-grape-harvest-400: #a298b9;
--color-grape-harvest-500: #8a7fa4;
--color-grape-harvest-600: #756c8b;
--color-grape-harvest-700: #5e566f;
--color-grape-harvest-800: #443f52;
--color-grape-harvest-900: #2f2b39;
--color-grape-harvest-950: #1b1924;
}SCSS
$grape-harvest: #807697;
$grape-harvest-rgb: 128, 118, 151;
$grape-harvest-light: mix(#fff, $grape-harvest, 20%);
$grape-harvest-dark: mix(#000, $grape-harvest, 20%);
.element {
color: $grape-harvest;
box-shadow: 0 0 0 2px rgba($grape-harvest, 0.35);
}