Colore con nome · #C3C6A4
Sage Splendour
Sage Splendour è #C3C6A4: rgb(195 198 164), hsl(65 23% 71%), oklch(0.815 0.046 111.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · Sage Splendour color name →
#C3C6A4
oklch(0.815 0.046 111.5)
Conversioni di colore
- HEX
- #c3c6a4
- RGB
- rgb(195 198 164)
- HSL
- hsl(65 23% 71%)
- HWB
- hwb(65 64% 22%)
- OKLCH
- oklch(0.815 0.046 111.5)
- OKLab
- oklab(0.815 -0.017 0.043)
- CIE Lab
- lab(78.97 -5.38 16.76)
- LCH
- lch(78.97 17.6 107.8)
- CMYK
- cmyk(2% 0% 17% 22%)
Tinte · Ombre · Toni
Tinte
- C9CCAD
- CFD1B6
- D5D7BF
- DBDDC8
- E1E2D1
- E7E8DA
- EDEEE3
- F3F3ED
- F9F9F6
Ombre
- A9AC8E
- 909279
- 787A64
- 606250
- 4A4B3D
- 34352B
- 20211A
- 0E0E0A
- 020201
Toni
- BCBFA0
- B5B89D
- AEB099
- A8A996
- A1A292
- 9A9B8F
- 94948B
- 8D8E87
- 868784
Armonie di colore
Complementare +180°
- C3C6A4
Sage Splendour
- C2BEDF
≈ Purple Dragon
Analogo -30° +30°
- C3C6A4
Sage Splendour
- D2C0A1
≈ Dad’s Slippers
- B3CBAF
≈ Relish
Triadico +120° +240°
- C3C6A4
Sage Splendour
- A5C9DC
≈ Piezo Blue
- DBB7C6
≈ Kunzite
Complementare divisa +150° +210°
- C3C6A4
Sage Splendour
- B2C3E1
≈ Eternal Elegance
- D1B9D5
≈ Petite Purple
Tetradico +90° +180° +270°
- C3C6A4
Sage Splendour
- A0CCCF
≈ Mystery
- C2BEDF
≈ Purple Dragon
- DFB7B5
≈ Cherry Tree
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.75:1 · APCA Lc 32
Ag
AAASu nero
WCAG 11.93:1 · APCA Lc 70
Miglior colore del testo: #000000
WCAG 11.93:1 (AAA) · APCA Lc 70
Contrast pairs
Frammenti di codice
CSS
:root {
--sage-splendour: #c3c6a4;
--sage-splendour-rgb: 195 198 164;
--sage-splendour-oklch: oklch(0.815 0.046 111.5);
}
.element {
color: var(--sage-splendour);
background-color: hsl(65 23% 71%);
border-color: oklch(0.815 0.046 111.5);
}Tailwind CSS v4
@theme {
--color-sage-splendour: #c3c6a4;
--color-sage-splendour-50: #f5f7e8;
--color-sage-splendour-100: #e7ead9;
--color-sage-splendour-200: #d4d7c1;
--color-sage-splendour-300: #b7baa0;
--color-sage-splendour-400: #9fa282;
--color-sage-splendour-500: #878a66;
--color-sage-splendour-600: #727457;
--color-sage-splendour-700: #5b5d45;
--color-sage-splendour-800: #434431;
--color-sage-splendour-900: #2e2f21;
--color-sage-splendour-950: #1b1b11;
}SCSS
$sage-splendour: #c3c6a4;
$sage-splendour-rgb: 195, 198, 164;
$sage-splendour-light: mix(#fff, $sage-splendour, 20%);
$sage-splendour-dark: mix(#000, $sage-splendour, 20%);
.element {
color: $sage-splendour;
box-shadow: 0 0 0 2px rgba($sage-splendour, 0.35);
}