Nazwany kolor · #8BC34A
Citrus Surge
Citrus Surge to #8BC34A: rgb(139 195 74), hsl(88 50% 53%), oklch(0.754 0.163 130.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Citrus Surge color name →
#8BC34A
oklch(0.754 0.163 130.5)
Konwersje koloru
- HEX
- #8bc34a
- RGB
- rgb(139 195 74)
- HSL
- hsl(88 50% 53%)
- HWB
- hwb(88 29% 24%)
- OKLCH
- oklch(0.754 0.163 130.5)
- OKLab
- oklab(0.754 -0.106 0.124)
- CIE Lab
- lab(73.08 -33.31 52.83)
- LCH
- lch(73.08 62.46 122.2)
- CMYK
- cmyk(29% 0% 62% 24%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 96C960
- A2D074
- ADD686
- B9DC98
- C4E2AA
- D0E8BB
- DCEECC
- E7F4DD
- F3F9EE
Odcienie ciemniejsze
- 78A93F
- 669035
- 54782A
- 436020
- 324A17
- 23340E
- 142006
- 070E02
- 010200
Tony
- 8ABC53
- 89B65B
- 88AF61
- 87A867
- 86A26C
- 859B71
- 849475
- 838E79
- 81877D
Harmonie kolorów
Komplementarna +180°
- 8BC34A
Citrus Surge
- CF8FFB
≈ Liliac
Analogowa -30° +30°
- 8BC34A
Citrus Surge
- C6B000
≈ Brownish Yellow
- 22CE8C
≈ Magical Malachite
Triada +120° +240°
- 8BC34A
Citrus Surge
- 6BB4FF
≈ French Sky Blue
- FF8298
≈ Strawberry Soap
Komplementarna rozszczepiona +150° +210°
- 8BC34A
Citrus Surge
- A0A5FF
≈ Widowmaker
- F282CE
≈ Blushed Bombshell
Tetrada +90° +180° +270°
- 8BC34A
Citrus Surge
- 00C2EB
≈ Blue Raspberry
- CF8FFB
≈ Liliac
- FF8A5F
≈ After Burn
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.09:1 · APCA Lc 41
Ag
AAANa czerni
WCAG 10.00:1 · APCA Lc 61
Najlepszy kolor tekstu: #000000
WCAG 10.00:1 (AAA) · APCA Lc 61
Contrast pairs
Fragmenty kodu
CSS
:root {
--citrus-surge: #8bc34a;
--citrus-surge-rgb: 139 195 74;
--citrus-surge-oklch: oklch(0.754 0.163 130.5);
}
.element {
color: var(--citrus-surge);
background-color: hsl(88 50% 53%);
border-color: oklch(0.754 0.163 130.5);
}Tailwind CSS v4
@theme {
--color-citrus-surge: #8bc34a;
--color-citrus-surge-50: #e4ffd0;
--color-citrus-surge-100: #d3f4bc;
--color-citrus-surge-200: #bae39b;
--color-citrus-surge-300: #97c96f;
--color-citrus-surge-400: #7db13f;
--color-citrus-surge-500: #5f9a00;
--color-citrus-surge-600: #518200;
--color-citrus-surge-700: #406800;
--color-citrus-surge-800: #314c00;
--color-citrus-surge-900: #213500;
--color-citrus-surge-950: #112000;
}SCSS
$citrus-surge: #8bc34a;
$citrus-surge-rgb: 139, 195, 74;
$citrus-surge-light: mix(#fff, $citrus-surge, 20%);
$citrus-surge-dark: mix(#000, $citrus-surge, 20%);
.element {
color: $citrus-surge;
box-shadow: 0 0 0 2px rgba($citrus-surge, 0.35);
}