← Back to Editor

#90BF49 · #668F29 · #306018 · #183018 · #001800

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatile

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#90BF49

Grass Green · DarkSeaGreen · Olive Green

HEX
#90BF49
RGB
rgb(144, 191, 73)
HSL
hsl(84, 48%, 52%)
HSB
hsb(84, 62%, 75%)
CMYK
cmyk(25%, 0%, 62%, 25%)
Oklch
oklch(74.7% 0.156 128.1)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#668F29

Grass Green · DarkOliveGreen · Forest Green

HEX
#668F29
RGB
rgb(102, 143, 41)
HSL
hsl(84, 55%, 36%)
HSB
hsb(84, 71%, 56%)
CMYK
cmyk(29%, 0%, 71%, 44%)
Oklch
oklch(59.9% 0.137 128.9)

Traditional「Grass Green」· Paint「Forest Green」· Creative Blush Sunrise

#306018

Pine Green · DarkOliveGreen · Forest Green

HEX
#306018
RGB
rgb(48, 96, 24)
HSL
hsl(100, 60%, 24%)
HSB
hsb(100, 75%, 38%)
CMYK
cmyk(50%, 0%, 75%, 62%)
Oklch
oklch(43.9% 0.115 137.2)

Traditional「Pine Green」· Paint「Forest Green」· Creative Blush Sunrise

#183018

Celadon · Black · Dark Green

HEX
#183018
RGB
rgb(24, 48, 24)
HSL
hsl(120, 33%, 14%)
HSB
hsb(120, 50%, 19%)
CMYK
cmyk(50%, 0%, 50%, 81%)
Oklch
oklch(28.2% 0.052 144.0)

Traditional「Celadon」· Paint「Dark Green」· Creative Blush Sunrise

#001800

Pine Green · Black · Dark Green

HEX
#001800
RGB
rgb(0, 24, 0)
HSL
hsl(120, 100%, 5%)
HSB
hsb(120, 100%, 9%)
CMYK
cmyk(100%, 0%, 100%, 91%)
Oklch
oklch(18.1% 0.062 142.5)

Traditional「Pine Green」· Paint「Dark Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

90BF49
794ABF

Analogous

BFB44A
90BF49
56BF4A

Triadic

90BF49
4A90BF
BF4A90

Split-Comp.

90BF49
4A56BF
B44ABF

Tetradic

90BF49
4ABFB4
794ABF
BF4A56

Contrast Matrix WCAG 2.1 Contrast

90BF49
668F29
306018
183018
001800
—
1.8
Fail
3.5
AA Large
6.6
AA
8.6
AAA
1.8
Fail
—
2.0
Fail
3.7
AA Large
4.9
AA
3.5
AA Large
2.0
Fail
—
1.9
Fail
2.5
Fail
6.6
AA
3.7
AA Large
1.9
Fail
—
1.3
Fail
8.6
AAA
4.9
AA
2.5
Fail
1.3
Fail
—
White BG
2.2Fail
3.8AA Large
7.5AAA
14.2AAA
18.6AAA
Black BG
9.7AAA
5.5AA
2.8Fail
1.5Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A4A566
787842
454529
22231E
0A0B06

Deuteranopia

A29E6C
757248
423E2E
211F1F
090707

Tritanopia

927C81
685559
32373A
192223
010A0B

Achromatopsia

A3A3A3
777777
494949
262626
0E0E0E

Shades & Tints Shades & Tints

#90BF49

Dark
Light

#668F29

Dark
Light

#306018

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #90bf49;
  --color-2: #668f29;
  --color-3: #306018;
  --color-4: #183018;
  --color-5: #001800;
}

SCSS

$color-1: #90bf49;
$color-2: #668f29;
$color-3: #306018;
$color-4: #183018;
$color-5: #001800;

TAILWIND

colors: {
  'brand-1': '#90bf49',
  'brand-2': '#668f29',
  'brand-3': '#306018',
  'brand-4': '#183018',
  'brand-5': '#001800',
}

RGB Array

[144, 191, 73], [102, 143, 41], [48, 96, 24], [24, 48, 24], [0, 24, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #90BF49, #668F29, #306018, #183018, #001800 is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #90bf49; --color-2: #668f29; --color-3: #306018; --color-4: #183018; --color-5: #001800. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. High-contrast palettes naturally meet WCAG accessibility standards. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This general-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color