#629C7C + #94BD6F + #AD9A22 + #774F1C + #A0002E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#629C7C

Celadon · CadetBlue · Olive Green

HEX

#629C7C

RGB

rgb(98, 156, 124)

HSL

hsl(147, 23%, 50%)

HSB

hsb(147, 37%, 61%)

CMYK

cmyk(37%, 0%, 21%, 39%)

Oklch

oklch(64.3% 0.078 159.0)

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

#94BD6F

Celadon · DarkSeaGreen · Olive Green

HEX

#94BD6F

RGB

rgb(148, 189, 111)

HSL

hsl(92, 37%, 59%)

HSB

hsb(92, 41%, 74%)

CMYK

cmyk(22%, 0%, 41%, 26%)

Oklch

oklch(75.0% 0.114 131.3)

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

#AD9A22

Autumn Sage · DarkGoldenRod · Honey Gold

HEX

#AD9A22

RGB

rgb(173, 154, 34)

HSL

hsl(52, 67%, 41%)

HSB

hsb(52, 80%, 68%)

CMYK

cmyk(0%, 11%, 80%, 32%)

Oklch

oklch(68.3% 0.132 99.6)

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

#774F1C

Ochre · Sienna · Amber Brown

HEX

#774F1C

RGB

rgb(119, 79, 28)

HSL

hsl(34, 62%, 29%)

HSB

hsb(34, 76%, 47%)

CMYK

cmyk(0%, 34%, 76%, 53%)

Oklch

oklch(46.2% 0.085 69.1)

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

#A0002E

Dark Violet · FireBrick · Camellia

HEX

#A0002E

RGB

rgb(160, 0, 46)

HSL

hsl(343, 100%, 31%)

HSB

hsb(343, 100%, 63%)

CMYK

cmyk(0%, 100%, 71%, 37%)

Oklch

oklch(44.8% 0.179 17.2)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

629C7C

9D6282

Analogous

659D62

629C7C

629D9A

Triadic

629C7C

7D629D

9D7D62

Split-Comp.

629C7C

9A629D

9D6265

Tetradic

629C7C

62659D

9D6282

9D9A62

Contrast Matrix WCAG 2.1 Contrast

629C7C	94BD6F	AD9A22	774F1C	A0002E
—	1.5 Fail	1.1 Fail	2.2 Fail	2.6 Fail
1.5 Fail	—	1.3 Fail	3.3 AA Large	3.9 AA Large
1.1 Fail	1.3 Fail	—	2.5 Fail	2.9 Fail
2.2 Fail	3.3 AA Large	2.5 Fail	—	1.2 Fail
2.6 Fail	3.9 AA Large	2.9 Fail	1.2 Fail	—

White BG

3.2AA Large

2.1Fail

2.8Fail

7.2AAA

8.3AAA

Black BG

6.6AA

9.8AAA

7.4AAA

2.9Fail

2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

7B7C84

A6A682

A5A53F

666528

5B5923

Deuteranopia

787386

A3A086

A6A746

686B2B

647020

Tritanopia

658A8B

969194

AC565B

753234

981A18

Achromatopsia

878787

A8A8A8

929292

555555

353535

Shades & Tints Shades & Tints

#629C7C

Dark

Light

#94BD6F

Dark

Light

#AD9A22

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #629c7c;
  --color-2: #94bd6f;
  --color-3: #ad9a22;
  --color-4: #774f1c;
  --color-5: #a0002e;
}

SCSS

$color-1: #629c7c;
$color-2: #94bd6f;
$color-3: #ad9a22;
$color-4: #774f1c;
$color-5: #a0002e;

TAILWIND

colors: {
  'brand-1': '#629c7c',
  'brand-2': '#94bd6f',
  'brand-3': '#ad9a22',
  'brand-4': '#774f1c',
  'brand-5': '#a0002e',
}

RGB Array

[98, 156, 124], [148, 189, 111], [173, 154, 34], [119, 79, 28], [160, 0, 46]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #629C7C, #94BD6F, #AD9A22, #774F1C, #A0002E 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: #629c7c; --color-2: #94bd6f; --color-3: #ad9a22; --color-4: #774f1c; --color-5: #a0002e. 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 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