← Back to Editor

#AEB087 · #61807A · #548C82 · #742250 · #40152D

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#AEB087

Fresh Green · DarkSeaGreen · Sunflower

HEX
#AEB087
RGB
rgb(174, 176, 135)
HSL
hsl(63, 21%, 61%)
HSB
hsb(63, 23%, 69%)
CMYK
cmyk(1%, 0%, 23%, 31%)
Oklch
oklch(74.5% 0.056 110.0)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#61807A

Mineral Blue · SlateGray · Mint Ice

HEX
#61807A
RGB
rgb(97, 128, 122)
HSL
hsl(168, 14%, 44%)
HSB
hsb(168, 24%, 50%)
CMYK
cmyk(24%, 0%, 5%, 50%)
Oklch
oklch(57.4% 0.037 181.8)

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

#548C82

Mineral Blue · SlateGray · Mint Ice

HEX
#548C82
RGB
rgb(84, 140, 130)
HSL
hsl(169, 25%, 44%)
HSB
hsb(169, 40%, 55%)
CMYK
cmyk(40%, 0%, 7%, 45%)
Oklch
oklch(59.8% 0.061 181.5)

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

#742250

Rose Purple · Purple · Camellia

HEX
#742250
RGB
rgb(116, 34, 80)
HSL
hsl(326, 55%, 29%)
HSB
hsb(326, 71%, 45%)
CMYK
cmyk(0%, 71%, 31%, 55%)
Oklch
oklch(39.5% 0.125 349.7)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#40152D

Rose Purple · DarkSlateGray · Raspberry

HEX
#40152D
RGB
rgb(64, 21, 45)
HSL
hsl(327, 51%, 17%)
HSB
hsb(327, 67%, 25%)
CMYK
cmyk(0%, 67%, 30%, 75%)
Oklch
oklch(27.3% 0.074 348.5)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AEB087
8987B0

Analogous

B09E87
AEB087
99B087

Triadic

AEB087
87AEB0
B087AE

Split-Comp.

AEB087
8799B0
9E87B0

Tetradic

AEB087
87B09E
8987B0
B08799

Contrast Matrix WCAG 2.1 Contrast

AEB087
61807A
548C82
742250
40152D
—
1.9
Fail
1.7
Fail
4.5
AA Large
6.9
AA
1.9
Fail
—
1.1
Fail
2.3
Fail
3.6
AA Large
1.7
Fail
1.1
Fail
—
2.6
Fail
4.0
AA Large
4.5
AA Large
2.3
Fail
2.6
Fail
—
1.5
Fail
6.9
AA
3.6
AA Large
4.0
AA Large
1.5
Fail
—
White BG
2.2Fail
4.3AA Large
3.9AA Large
10.1AAA
15.4AAA
Black BG
9.4AAA
4.9AA
5.5AA
2.1Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

AFAF91
6E6F7B
6C6D84
505045
2D2D27

Deuteranopia

AFAF93
6D6A7C
696585
555B42
303326

Tritanopia

AE999A
637D7D
578687
703C3A
3E2322

Achromatopsia

ABABAB
767676
7A7A7A
404040
252525

Shades & Tints Shades & Tints

#AEB087

Dark
Light

#61807A

Dark
Light

#548C82

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #aeb087;
  --color-2: #61807a;
  --color-3: #548c82;
  --color-4: #742250;
  --color-5: #40152d;
}

SCSS

$color-1: #aeb087;
$color-2: #61807a;
$color-3: #548c82;
$color-4: #742250;
$color-5: #40152d;

TAILWIND

colors: {
  'brand-1': '#aeb087',
  'brand-2': '#61807a',
  'brand-3': '#548c82',
  'brand-4': '#742250',
  'brand-5': '#40152d',
}

RGB Array

[174, 176, 135], [97, 128, 122], [84, 140, 130], [116, 34, 80], [64, 21, 45]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #AEB087, #61807A, #548C82, #742250, #40152D 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: #aeb087; --color-2: #61807a; --color-3: #548c82; --color-4: #742250; --color-5: #40152d. 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