Colore con nome · #7D7081
British Grey Mauve
British Grey Mauve è #7D7081: rgb(125 112 129), hsl(286 7% 47%), oklch(0.563 0.03 318.2). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Gray mean? → · British Grey Mauve color name →
#7D7081
oklch(0.563 0.03 318.2)
Conversioni di colore
- HEX
- #7d7081
- RGB
- rgb(125 112 129)
- HSL
- hsl(286 7% 47%)
- HWB
- hwb(286 44% 49%)
- OKLCH
- oklch(0.563 0.03 318.2)
- OKLab
- oklab(0.563 0.022 -0.02)
- CIE Lab
- lab(48.9 7.74 -7.46)
- LCH
- lch(48.9 10.75 316)
- CMYK
- cmyk(3% 13% 0% 49%)
Tinte · Ombre · Toni
Tinte
- 897D8D
- 968B99
- A299A5
- AFA7B2
- BCB5BE
- C9C3CB
- D6D2D8
- E4E1E5
- F1F0F2
Ombre
- 6C606F
- 5B515E
- 4B434E
- 3B353E
- 2C272E
- 1E1A1F
- 110E12
- 050406
- 010101
Toni
- 7D7281
- 7E7381
- 7E7581
- 7E7681
- 7F7881
- 7F7A80
- 7F7B80
- 7F7D80
- 807E80
Armonie di colore
Complementare +180°
- 7D7081
British Grey Mauve
- 6D7A69
≈ Fir Spruce Green
Analogo -30° +30°
- 7D7081
British Grey Mauve
- 747386
≈ Ash Mauve
- 846E78
≈ Innocent Pink
Triadico +120° +240°
- 7D7081
British Grey Mauve
- 7F7362
≈ Coriander Ochre
- 617B7C
≈ Eye Grey
Complementare divisa +150° +210°
- 7D7081
British Grey Mauve
- 777763
≈ November Green
- 657B72
≈ Stockleaf
Tetradico +90° +180° +270°
- 7D7081
British Grey Mauve
- 857066
≈ Pipe
- 6D7A69
≈ Fir Spruce Green
- 637983
≈ Blue Monday
Contrasto e accessibilità
Ag
AASu bianco
WCAG 4.65:1 · APCA Lc 72
Ag
AASu nero
WCAG 4.50:1 · APCA Lc 29
Miglior colore del testo: #FFFFFF
WCAG 4.65:1 (AA) · APCA Lc 72
Contrast pairs
Frammenti di codice
CSS
:root {
--british-grey-mauve: #7d7081;
--british-grey-mauve-rgb: 125 112 129;
--british-grey-mauve-oklch: oklch(0.563 0.03 318.2);
}
.element {
color: var(--british-grey-mauve);
background-color: hsl(286 7% 47%);
border-color: oklch(0.563 0.03 318.2);
}Tailwind CSS v4
@theme {
--color-british-grey-mauve: #7d7081;
--color-british-grey-mauve-50: #f9f2fb;
--color-british-grey-mauve-100: #ede5ee;
--color-british-grey-mauve-200: #dad0dc;
--color-british-grey-mauve-300: #bfb3c1;
--color-british-grey-mauve-400: #a699aa;
--color-british-grey-mauve-500: #8f8093;
--color-british-grey-mauve-600: #796d7d;
--color-british-grey-mauve-700: #615764;
--color-british-grey-mauve-800: #473f4a;
--color-british-grey-mauve-900: #312c33;
--color-british-grey-mauve-950: #1d191f;
}SCSS
$british-grey-mauve: #7d7081;
$british-grey-mauve-rgb: 125, 112, 129;
$british-grey-mauve-light: mix(#fff, $british-grey-mauve, 20%);
$british-grey-mauve-dark: mix(#000, $british-grey-mauve, 20%);
.element {
color: $british-grey-mauve;
box-shadow: 0 0 0 2px rgba($british-grey-mauve, 0.35);
}