Colore con nome · #6C6068
Vibrant Vision
Vibrant Vision è #6C6068: rgb(108 96 104), hsl(320 6% 40%), oklch(0.503 0.02 338). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Vibrant Vision color name →
#6C6068
oklch(0.503 0.02 338)
Conversioni di colore
- HEX
- #6c6068
- RGB
- rgb(108 96 104)
- HSL
- hsl(320 6% 40%)
- HWB
- hwb(320 38% 58%)
- OKLCH
- oklch(0.503 0.02 338)
- OKLab
- oklab(0.503 0.018 -0.007)
- CIE Lab
- lab(42.09 6.14 -2.71)
- LCH
- lch(42.09 6.71 336.1)
- CMYK
- cmyk(0% 11% 4% 58%)
Tinte · Ombre · Toni
Tinte
- 7A6F76
- 887D84
- 968D93
- A49CA1
- B3ACB0
- C2BCC0
- D1CDCF
- E0DDDF
- EFEEEF
Ombre
- 5D5259
- 4E454B
- 40383E
- 322C30
- 252024
- 191518
- 0D0A0C
- 040304
- 000000
Toni
- 6E636A
- 70666D
- 72696F
- 746D72
- 767074
- 787376
- 7A7679
- 7C797B
- 7E7D7E
Armonie di colore
Complementare +180°
- 6C6068
Vibrant Vision
- 5B6860
≈ Pine Mountain
Analogo -30° +30°
- 6C6068
Vibrant Vision
- 67616D
≈ Muted Mulberry
- 6F6062
≈ Duomo
Triadico +120° +240°
- 6C6068
Vibrant Vision
- 676458
≈ Nevergreen
- 58676C
≈ Whale Grey
Complementare divisa +150° +210°
- 6C6068
Vibrant Vision
- 61665B
≈ Woohringa
- 586866
≈ Brooklyn
Tetradico +90° +180° +270°
- 6C6068
Vibrant Vision
- 6C6258
≈ Carriage
- 5B6860
≈ Pine Mountain
- 5C656F
≈ Slate Grey
Contrasto e accessibilità
Ag
AASu bianco
WCAG 5.98:1 · APCA Lc 80
Ag
FailSu nero
WCAG 3.51:1 · APCA Lc 22
Miglior colore del testo: #FFFFFF
WCAG 5.98:1 (AA) · APCA Lc 80
Contrast pairs
Frammenti di codice
CSS
:root {
--vibrant-vision: #6c6068;
--vibrant-vision-rgb: 108 96 104;
--vibrant-vision-oklch: oklch(0.503 0.02 338);
}
.element {
color: var(--vibrant-vision);
background-color: hsl(320 6% 40%);
border-color: oklch(0.503 0.02 338);
}Tailwind CSS v4
@theme {
--color-vibrant-vision: #6c6068;
--color-vibrant-vision-50: #f9f3f7;
--color-vibrant-vision-100: #ede5ea;
--color-vibrant-vision-200: #dad1d7;
--color-vibrant-vision-300: #bfb4ba;
--color-vibrant-vision-400: #a79aa2;
--color-vibrant-vision-500: #8f818b;
--color-vibrant-vision-600: #796e75;
--color-vibrant-vision-700: #61585e;
--color-vibrant-vision-800: #474045;
--color-vibrant-vision-900: #312c30;
--color-vibrant-vision-950: #1d191c;
}SCSS
$vibrant-vision: #6c6068;
$vibrant-vision-rgb: 108, 96, 104;
$vibrant-vision-light: mix(#fff, $vibrant-vision, 20%);
$vibrant-vision-dark: mix(#000, $vibrant-vision, 20%);
.element {
color: $vibrant-vision;
box-shadow: 0 0 0 2px rgba($vibrant-vision, 0.35);
}