#46916C + #3E7850 + #3F5E2F + #403F1F + #381F15 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#46916C

Mineral Blue · SeaGreen · Olive Green

HEX

#46916C

RGB

rgb(70, 145, 108)

HSL

hsl(150, 35%, 42%)

HSB

hsb(150, 52%, 57%)

CMYK

cmyk(52%, 0%, 26%, 43%)

Oklch

oklch(59.8% 0.095 160.1)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#3E7850

Celadon · SeaGreen · Forest Green

HEX

#3E7850

RGB

rgb(62, 120, 80)

HSL

hsl(139, 32%, 36%)

HSB

hsb(139, 48%, 47%)

CMYK

cmyk(48%, 0%, 33%, 53%)

Oklch

oklch(52.2% 0.088 152.3)

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

#3F5E2F

Celadon · DarkOliveGreen · Forest Green

HEX

#3F5E2F

RGB

rgb(63, 94, 47)

HSL

hsl(100, 33%, 28%)

HSB

hsb(100, 50%, 37%)

CMYK

cmyk(33%, 0%, 50%, 63%)

Oklch

oklch(44.5% 0.081 135.8)

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

#403F1F

Autumn Sage · DarkOliveGreen · Amber Gold

HEX

#403F1F

RGB

rgb(64, 63, 31)

HSL

hsl(58, 35%, 19%)

HSB

hsb(58, 52%, 25%)

CMYK

cmyk(0%, 2%, 52%, 75%)

Oklch

oklch(36.0% 0.049 107.1)

Traditional「Autumn Sage」· Paint「Amber Gold」· Creative Blush Sunrise

#381F15

Tangerine · Black · Cinnamon

HEX

#381F15

RGB

rgb(56, 31, 21)

HSL

hsl(17, 45%, 15%)

HSB

hsb(17, 63%, 22%)

CMYK

cmyk(0%, 45%, 62%, 78%)

Oklch

oklch(27.0% 0.043 42.4)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

46916C

91466B

Analogous

469146

46916C

469191

Triadic

46916C

6B4691

916B46

Split-Comp.

46916C

914691

914646

Tetradic

46916C

464691

91466B

919146

Contrast Matrix WCAG 2.1 Contrast

46916C	3E7850	3F5E2F	403F1F	381F15
—	1.4 Fail	1.9 Fail	2.8 Fail	4.0 AA Large
1.4 Fail	—	1.4 Fail	2.1 Fail	2.9 Fail
1.9 Fail	1.4 Fail	—	1.5 Fail	2.1 Fail
2.8 Fail	2.1 Fail	1.5 Fail	—	1.4 Fail
4.0 AA Large	2.9 Fail	2.1 Fail	1.4 Fail	—

White BG

3.8AA Large

5.2AA

7.4AAA

10.8AAA

15.3AAA

Black BG

5.5AA

4.0AA Large

2.9Fail

1.9Fail

1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

666775

57585A

4C4D3A

404027

2D2D17

Deuteranopia

625D77

544F5C

4B483D

404029

2F3018

Tritanopia

4A7C7E

416163

414345

402D2E

37191A

Achromatopsia

767676

626262

4F4F4F

3C3C3C

252525

Shades & Tints Shades & Tints

#46916C

Dark

Light

#3E7850

Dark

Light

#3F5E2F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #46916c;
  --color-2: #3e7850;
  --color-3: #3f5e2f;
  --color-4: #403f1f;
  --color-5: #381f15;
}

SCSS

$color-1: #46916c;
$color-2: #3e7850;
$color-3: #3f5e2f;
$color-4: #403f1f;
$color-5: #381f15;

TAILWIND

colors: {
  'brand-1': '#46916c',
  'brand-2': '#3e7850',
  'brand-3': '#3f5e2f',
  'brand-4': '#403f1f',
  'brand-5': '#381f15',
}

RGB Array

[70, 145, 108], [62, 120, 80], [63, 94, 47], [64, 63, 31], [56, 31, 21]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #46916C, #3E7850, #3F5E2F, #403F1F, #381F15 is ideal for: tech websites, dark mode UIs, game UIs. 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: #46916c; --color-2: #3e7850; --color-3: #3f5e2f; --color-4: #403f1f; --color-5: #381f15. 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. 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