#6FB39C + #96B382 + #A7B848 + #E39439 + #664B31 · warm - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#6FB39C

Mineral Blue · CadetBlue · Lake Green

HEX

#6FB39C

RGB

rgb(111, 179, 156)

HSL

hsl(160, 31%, 57%)

HSB

hsb(160, 38%, 70%)

CMYK

cmyk(38%, 0%, 13%, 30%)

Oklch

oklch(71.5% 0.078 170.5)

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

#96B382

Celadon · DarkSeaGreen · Apple Green

HEX

#96B382

RGB

rgb(150, 179, 130)

HSL

hsl(96, 24%, 61%)

HSB

hsb(96, 27%, 70%)

CMYK

cmyk(16%, 0%, 27%, 30%)

Oklch

oklch(73.2% 0.075 132.9)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#A7B848

Autumn Sage · GoldenRod · Honey Gold

HEX

#A7B848

RGB

rgb(167, 184, 72)

HSL

hsl(69, 44%, 50%)

HSB

hsb(69, 61%, 72%)

CMYK

cmyk(9%, 0%, 61%, 28%)

Oklch

oklch(74.7% 0.138 117.1)

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

#E39439

Ginger · GoldenRod · Warm Sun

HEX

#E39439

RGB

rgb(227, 148, 57)

HSL

hsl(32, 75%, 56%)

HSB

hsb(32, 75%, 89%)

CMYK

cmyk(0%, 35%, 75%, 11%)

Oklch

oklch(73.1% 0.140 65.7)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#664B31

Tangerine · DarkOliveGreen · Amber Brown

HEX

#664B31

RGB

rgb(102, 75, 49)

HSL

hsl(29, 35%, 30%)

HSB

hsb(29, 52%, 40%)

CMYK

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

Oklch

oklch(43.5% 0.054 64.6)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6FB39C

B36F86

Analogous

6FB37B

6FB39C

6FA8B3

Triadic

6FB39C

9D6FB3

B39D6F

Split-Comp.

6FB39C

B36FA8

B37B6F

Tetradic

6FB39C

7B6FB3

B36F86

A8B36F

Contrast Matrix WCAG 2.1 Contrast

6FB39C	96B382	A7B848	E39439	664B31
—	1.1 Fail	1.1 Fail	1.0 Fail	3.3 AA Large
1.1 Fail	—	1.1 Fail	1.1 Fail	3.5 AA Large
1.1 Fail	1.1 Fail	—	1.1 Fail	3.7 AA Large
1.0 Fail	1.1 Fail	1.1 Fail	—	3.3 AA Large
3.3 AA Large	3.5 AA Large	3.7 AA Large	3.3 AA Large	—

White BG

2.4Fail

2.3Fail

2.2Fail

2.5Fail

8.0AAA

Black BG

8.6AAA

9.1AAA

9.6AAA

8.6AAA

2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8C8DA2

A3A38E

AEAF63

C1C04F

5A5A37

Deuteranopia

8983A3

A19F91

ADAC6A

C5CB54

5C5E39

Tritanopia

72A6A7

979799

A8787D

DF6064

653C3D

Achromatopsia

9C9C9C

A5A5A5

A6A6A6

A1A1A1

505050

Shades & Tints Shades & Tints

#6FB39C

Dark

Light

#96B382

Dark

Light

#A7B848

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6fb39c;
  --color-2: #96b382;
  --color-3: #a7b848;
  --color-4: #e39439;
  --color-5: #664b31;
}

SCSS

$color-1: #6fb39c;
$color-2: #96b382;
$color-3: #a7b848;
$color-4: #e39439;
$color-5: #664b31;

TAILWIND

colors: {
  'brand-1': '#6fb39c',
  'brand-2': '#96b382',
  'brand-3': '#a7b848',
  'brand-4': '#e39439',
  'brand-5': '#664b31',
}

RGB Array

[111, 179, 156], [150, 179, 130], [167, 184, 72], [227, 148, 57], [102, 75, 49]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #6FB39C, #96B382, #A7B848, #E39439, #664B31 is ideal for: corporate websites, product showcases, portfolios. 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: #6fb39c; --color-2: #96b382; --color-3: #a7b848; --color-4: #e39439; --color-5: #664b31. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 warm-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