#A5B26C + #6C9169 + #326F66 + #204F5D + #2E3B54 · sunset - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#A5B26C

Grass Green · DarkSeaGreen · Olive Green

HEX

#A5B26C

RGB

rgb(165, 178, 108)

HSL

hsl(71, 31%, 56%)

HSB

hsb(71, 39%, 70%)

CMYK

cmyk(7%, 0%, 39%, 30%)

Oklch

oklch(73.7% 0.094 117.4)

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

#6C9169

Celadon · Gray · Olive Green

HEX

#6C9169

RGB

rgb(108, 145, 105)

HSL

hsl(115, 16%, 49%)

HSB

hsb(115, 28%, 57%)

CMYK

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

Oklch

oklch(61.8% 0.072 142.8)

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

#326F66

Mineral Blue · SeaGreen · Mint Ice

HEX

#326F66

RGB

rgb(50, 111, 102)

HSL

hsl(171, 38%, 32%)

HSB

hsb(171, 55%, 44%)

CMYK

cmyk(55%, 0%, 8%, 56%)

Oklch

oklch(49.9% 0.065 182.7)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#204F5D

Slate Blue · DarkSlateGray · Peacock Green

HEX

#204F5D

RGB

rgb(32, 79, 93)

HSL

hsl(194, 49%, 25%)

HSB

hsb(194, 66%, 36%)

CMYK

cmyk(66%, 15%, 0%, 64%)

Oklch

oklch(40.1% 0.056 220.4)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#2E3B54

Indigo · DarkSlateGray · Prussian Blue

HEX

#2E3B54

RGB

rgb(46, 59, 84)

HSL

hsl(219, 29%, 25%)

HSB

hsb(219, 45%, 33%)

CMYK

cmyk(45%, 30%, 0%, 67%)

Oklch

oklch(35.2% 0.047 263.0)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A5B26C

796CB2

Analogous

B29C6C

A5B26C

82B26C

Triadic

A5B26C

6CA5B2

B26CA5

Split-Comp.

A5B26C

6C82B2

9C6CB2

Tetradic

A5B26C

6CB29C

796CB2

B26C82

Contrast Matrix WCAG 2.1 Contrast

A5B26C	6C9169	326F66	204F5D	2E3B54
—	1.6 Fail	2.6 Fail	3.9 AA Large	4.9 AA
1.6 Fail	—	1.6 Fail	2.5 Fail	3.2 AA Large
2.6 Fail	1.6 Fail	—	1.5 Fail	1.9 Fail
3.9 AA Large	2.5 Fail	1.5 Fail	—	1.3 Fail
4.9 AA	3.2 AA Large	1.9 Fail	1.3 Fail	—

White BG

2.3Fail

3.6AA Large

5.8AA

9.0AAA

11.2AAA

Black BG

9.2AAA

5.9AA

3.6AA Large

2.3Fail

1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

ABAB7D

7C7C73

4C4D68

34355A

34344E

Deuteranopia

AAA981

7A7775

494469

322E59

33324D

Tritanopia

A68A8D

6E7A7C

356A6A

225756

2F4948

Achromatopsia

A6A6A6

818181

5C5C5C

434343

3A3A3A

Shades & Tints Shades & Tints

#A5B26C

Dark

Light

#6C9169

Dark

Light

#326F66

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a5b26c;
  --color-2: #6c9169;
  --color-3: #326f66;
  --color-4: #204f5d;
  --color-5: #2e3b54;
}

SCSS

$color-1: #a5b26c;
$color-2: #6c9169;
$color-3: #326f66;
$color-4: #204f5d;
$color-5: #2e3b54;

TAILWIND

colors: {
  'brand-1': '#a5b26c',
  'brand-2': '#6c9169',
  'brand-3': '#326f66',
  'brand-4': '#204f5d',
  'brand-5': '#2e3b54',
}

RGB Array

[165, 178, 108], [108, 145, 105], [50, 111, 102], [32, 79, 93], [46, 59, 84]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #A5B26C, #6C9169, #326F66, #204F5D, #2E3B54 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: #a5b26c; --color-2: #6c9169; --color-3: #326f66; --color-4: #204f5d; --color-5: #2e3b54. 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 sunset-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