Nazwany kolor · #5F9370
Skarsnik Green
Skarsnik Green to #5F9370: rgb(95 147 112), hsl(140 21% 47%), oklch(0.616 0.077 154.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Skarsnik Green color name →
#5F9370
oklch(0.616 0.077 154.1)
Konwersje koloru
- HEX
- #5f9370
- RGB
- rgb(95 147 112)
- HSL
- hsl(140 21% 47%)
- HWB
- hwb(140 37% 42%)
- OKLCH
- oklch(0.616 0.077 154.1)
- OKLab
- oklab(0.616 -0.069 0.034)
- CIE Lab
- lab(56.53 -24.02 12.87)
- LCH
- lch(56.53 27.25 151.8)
- CMYK
- cmyk(35% 0% 24% 42%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 6F9D7D
- 7FA88B
- 8EB399
- 9EBDA7
- AEC8B5
- BED3C4
- CEDED2
- DEE9E1
- EFF4F0
Odcienie ciemniejsze
- 527F60
- 446C51
- 385943
- 2C4735
- 203627
- 15251A
- 0A160E
- 030804
- 000101
Tony
- 639172
- 678F73
- 6A8E75
- 6E8C77
- 718A78
- 74887A
- 77867B
- 7A847D
- 7D827E
Harmonie kolorów
Komplementarna +180°
- 5F9370
Skarsnik Green
- A27498
≈ Drama Queen
Analogowa -30° +30°
- 5F9370
Skarsnik Green
- 7B8D59
≈ Scarabœus Nobilis
- 49948A
≈ Mirage Lake
Triada +120° +240°
- 5F9370
Skarsnik Green
- 7782B4
≈ Venture Violet
- AE7466
≈ Pajarito Red
Komplementarna rozszczepiona +150° +210°
- 5F9370
Skarsnik Green
- 8F7AAB
≈ Trumpeter
- AD7180
≈ Shade of Mauve
Tetrada +90° +180° +270°
- 5F9370
Skarsnik Green
- 5C8AB0
≈ Lichen Blue
- A27498
≈ Drama Queen
- A67B53
≈ Apple Seed
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.56:1 · APCA Lc 63
Ag
AANa czerni
WCAG 5.89:1 · APCA Lc 39
Najlepszy kolor tekstu: #000000
WCAG 5.89:1 (AA) · APCA Lc 39
Contrast pairs
Fragmenty kodu
CSS
:root {
--skarsnik-green: #5f9370;
--skarsnik-green-rgb: 95 147 112;
--skarsnik-green-oklch: oklch(0.616 0.077 154.1);
}
.element {
color: var(--skarsnik-green);
background-color: hsl(140 21% 47%);
border-color: oklch(0.616 0.077 154.1);
}Tailwind CSS v4
@theme {
--color-skarsnik-green: #5f9370;
--color-skarsnik-green-50: #e4fcec;
--color-skarsnik-green-100: #d4f0dd;
--color-skarsnik-green-200: #bbdfc7;
--color-skarsnik-green-300: #98c4a7;
--color-skarsnik-green-400: #7aac8a;
--color-skarsnik-green-500: #5b956f;
--color-skarsnik-green-600: #4e7e5e;
--color-skarsnik-green-700: #3e654b;
--color-skarsnik-green-800: #2d4a35;
--color-skarsnik-green-900: #1f3324;
--color-skarsnik-green-950: #0e1f13;
}SCSS
$skarsnik-green: #5f9370;
$skarsnik-green-rgb: 95, 147, 112;
$skarsnik-green-light: mix(#fff, $skarsnik-green, 20%);
$skarsnik-green-dark: mix(#000, $skarsnik-green, 20%);
.element {
color: $skarsnik-green;
box-shadow: 0 0 0 2px rgba($skarsnik-green, 0.35);
}