Colore con nome · #3C773C
Cucumber Queen
Cucumber Queen è #3C773C: rgb(60 119 60), hsl(120 33% 35%), oklch(0.514 0.109 143.8). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Green mean? → · Cucumber Queen color name →
#3C773C
oklch(0.514 0.109 143.8)
Conversioni di colore
- HEX
- #3c773c
- RGB
- rgb(60 119 60)
- HSL
- hsl(120 33% 35%)
- HWB
- hwb(120 24% 53%)
- OKLCH
- oklch(0.514 0.109 143.8)
- OKLab
- oklab(0.514 -0.088 0.064)
- CIE Lab
- lab(44.95 -29.99 26.11)
- LCH
- lch(44.95 39.76 139)
- CMYK
- cmyk(50% 0% 50% 53%)
Tinte · Ombre · Toni
Tinte
- 50844F
- 639161
- 769F74
- 89AC87
- 9CBA9B
- AFC7AE
- C3D5C2
- D7E3D6
- EBF1EA
Ombre
- 336733
- 2A572A
- 214721
- 193819
- 112A11
- 0A1C0A
- 041004
- 010501
- 000100
Toni
- 447844
- 4C794B
- 537A52
- 5A7B59
- 607C5F
- 677D66
- 6D7E6D
- 747F73
- 7A7F7A
Armonie di colore
Complementare +180°
- 3C773C
Cucumber Queen
- 85508B
≈ Voodoo Violet
Analogo -30° +30°
- 3C773C
Cucumber Queen
- 676D10
≈ Brownish Green
- 007963
≈ Ultramarine Green
Triadico +120° +240°
- 3C773C
Cucumber Queen
- 4665A6
≈ Starstruck
- 9C4B48
≈ Regal Red
Complementare divisa +150° +210°
- 3C773C
Cucumber Queen
- 6B599F
≈ Sumire Violet
- 964A6C
≈ Befitting
Tetradico +90° +180° +270°
- 3C773C
Cucumber Queen
- 00709B
≈ Tofino Belue
- 85508B
≈ Voodoo Violet
- 975321
≈ Mammoth Wool
Contrasto e accessibilità
Ag
AASu bianco
WCAG 5.38:1 · APCA Lc 77
Ag
FailSu nero
WCAG 3.89:1 · APCA Lc 25
Miglior colore del testo: #FFFFFF
WCAG 5.38:1 (AA) · APCA Lc 77
Contrast pairs
Frammenti di codice
CSS
:root {
--cucumber-queen: #3c773c;
--cucumber-queen-rgb: 60 119 60;
--cucumber-queen-oklch: oklch(0.514 0.109 143.8);
}
.element {
color: var(--cucumber-queen);
background-color: hsl(120 33% 35%);
border-color: oklch(0.514 0.109 143.8);
}Tailwind CSS v4
@theme {
--color-cucumber-queen: #3c773c;
--color-cucumber-queen-50: #e2fee3;
--color-cucumber-queen-100: #d2f2d2;
--color-cucumber-queen-200: #b7e1b9;
--color-cucumber-queen-300: #94c796;
--color-cucumber-queen-400: #76af74;
--color-cucumber-queen-500: #569955;
--color-cucumber-queen-600: #498149;
--color-cucumber-queen-700: #3a673a;
--color-cucumber-queen-800: #2b4c27;
--color-cucumber-queen-900: #1d351a;
--color-cucumber-queen-950: #0d200b;
}SCSS
$cucumber-queen: #3c773c;
$cucumber-queen-rgb: 60, 119, 60;
$cucumber-queen-light: mix(#fff, $cucumber-queen, 20%);
$cucumber-queen-dark: mix(#000, $cucumber-queen, 20%);
.element {
color: $cucumber-queen;
box-shadow: 0 0 0 2px rgba($cucumber-queen, 0.35);
}