Nazwany kolor · #66AA00
Appetising Asparagus
Appetising Asparagus to #66AA00: rgb(102 170 0), hsl(84 100% 33%), oklch(0.666 0.186 132.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Appetising Asparagus color name →
#66AA00
oklch(0.666 0.186 132.2)
Konwersje koloru
- HEX
- #66aa00
- RGB
- rgb(102 170 0)
- HSL
- hsl(84 100% 33%)
- HWB
- hwb(84 0% 33%)
- OKLCH
- oklch(0.666 0.186 132.2)
- OKLab
- oklab(0.666 -0.125 0.137)
- CIE Lab
- lab(63.16 -39.05 63.02)
- LCH
- lch(63.16 74.14 121.8)
- CMYK
- cmyk(40% 0% 100% 33%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 75B337
- 84BC53
- 94C46B
- A3CD81
- B2D697
- C1DEAC
- D0E6C1
- E0EFD5
- EFF7EA
Odcienie ciemniejsze
- 589300
- 4A7D00
- 3C6800
- 2F5300
- 233F00
- 172D00
- 0C1B00
- 040B00
- 000100
Tony
- 69A626
- 6CA238
- 6F9E45
- 729A51
- 75965A
- 779263
- 7A8E6B
- 7C8972
- 7E8579
Harmonie kolorów
Komplementarna +180°
- 66AA00
Appetising Asparagus
- BA6CE5
≈ Lavender
Analogowa -30° +30°
- 66AA00
Appetising Asparagus
- A59600
≈ Nuclear Fallout
- 00AF78
≈ Bright Camouflage
Triada +120° +240°
- 66AA00
Appetising Asparagus
- 2996FF
≈ Blue Nebula
- EF5875
≈ Lick and Kiss
Komplementarna rozszczepiona +150° +210°
- 66AA00
Appetising Asparagus
- 8680FF
≈ Blue Party Parrot
- DD5DB3
≈ Orion
Tetrada +90° +180° +270°
- 66AA00
Appetising Asparagus
- 00A4CA
≈ Charybdis
- BA6CE5
≈ Lavender
- ED6321
≈ Ryza Dust
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.87:1 · APCA Lc 55
Ag
AAANa czerni
WCAG 7.31:1 · APCA Lc 47
Najlepszy kolor tekstu: #000000
WCAG 7.31:1 (AAA) · APCA Lc 47
Contrast pairs
Fragmenty kodu
CSS
:root {
--appetising-asparagus: #66aa00;
--appetising-asparagus-rgb: 102 170 0;
--appetising-asparagus-oklch: oklch(0.666 0.186 132.2);
}
.element {
color: var(--appetising-asparagus);
background-color: hsl(84 100% 33%);
border-color: oklch(0.666 0.186 132.2);
}Tailwind CSS v4
@theme {
--color-appetising-asparagus: #66aa00;
--color-appetising-asparagus-50: #dfffcc;
--color-appetising-asparagus-100: #cef6b7;
--color-appetising-asparagus-200: #b3e694;
--color-appetising-asparagus-300: #8ecc66;
--color-appetising-asparagus-400: #73b42c;
--color-appetising-asparagus-500: #529d00;
--color-appetising-asparagus-600: #478500;
--color-appetising-asparagus-700: #386a00;
--color-appetising-asparagus-800: #2b4e00;
--color-appetising-asparagus-900: #1d3600;
--color-appetising-asparagus-950: #0d2100;
}SCSS
$appetising-asparagus: #66aa00;
$appetising-asparagus-rgb: 102, 170, 0;
$appetising-asparagus-light: mix(#fff, $appetising-asparagus, 20%);
$appetising-asparagus-dark: mix(#000, $appetising-asparagus, 20%);
.element {
color: $appetising-asparagus;
box-shadow: 0 0 0 2px rgba($appetising-asparagus, 0.35);
}