← Back to Editor

#877569 · #DDBE9B · #70EBDC · #80002D · #FFE697

minimal

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

RestrainedProfessionalPureWarmCool

Industry INDUSTRY

ArchitectureManufacturingSaaS B2B

UI Context UI CONTEXT

Corporate SitePortfolioAdmin PanelData Visualization

Color Details Color Details

#877569

Tangerine · Gray · Amber Brown

HEX
#877569
RGB
rgb(135, 117, 105)
HSL
hsl(24, 13%, 47%)
HSB
hsb(24, 22%, 53%)
CMYK
cmyk(0%, 13%, 22%, 47%)
Oklch
oklch(57.6% 0.029 55.7)

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

#DDBE9B

Goose Yellow · BurlyWood · Warm Sun

HEX
#DDBE9B
RGB
rgb(221, 190, 155)
HSL
hsl(32, 49%, 74%)
HSB
hsb(32, 30%, 87%)
CMYK
cmyk(0%, 14%, 30%, 13%)
Oklch
oklch(81.9% 0.059 70.3)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#70EBDC

Jade · SkyBlue · Lake Green

HEX
#70EBDC
RGB
rgb(112, 235, 220)
HSL
hsl(173, 75%, 68%)
HSB
hsb(173, 52%, 92%)
CMYK
cmyk(52%, 0%, 6%, 8%)
Oklch
oklch(86.5% 0.113 184.7)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#80002D

Dark Violet · Maroon · Raspberry

HEX
#80002D
RGB
rgb(128, 0, 45)
HSL
hsl(339, 100%, 25%)
HSB
hsb(339, 100%, 50%)
CMYK
cmyk(0%, 100%, 65%, 50%)
Oklch
oklch(38.3% 0.153 11.8)

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

#FFE697

Goose Yellow · Khaki · Lemon Cream

HEX
#FFE697
RGB
rgb(255, 230, 151)
HSL
hsl(46, 100%, 80%)
HSB
hsb(46, 41%, 100%)
CMYK
cmyk(0%, 10%, 41%, 0%)
Oklch
oklch(92.8% 0.102 92.5)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

877569
687B87

Analogous

87686B
877569
878468

Triadic

877569
688775
756887

Split-Comp.

877569
688784
686B87

Tetradic

877569
6B8768
687B87
846887

Contrast Matrix WCAG 2.1 Contrast

877569
DDBE9B
70EBDC
80002D
FFE697
—
2.5
Fail
3.1
AA Large
2.4
Fail
3.6
AA Large
2.5
Fail
—
1.2
Fail
6.1
AA
1.4
Fail
3.1
AA Large
1.2
Fail
—
7.5
AAA
1.2
Fail
2.4
Fail
6.1
AA
7.5
AAA
—
8.7
AAA
3.6
AA Large
1.4
Fail
1.2
Fail
8.7
AAA
—
White BG
4.4AA Large
1.8Fail
1.4Fail
10.7AAA
1.2Fail
Black BG
4.8AA
11.9AAA
14.6AAA
2.0Fail
17.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7F7F6C
D0CFA3
A5A6E0
494722
F4F4AA

Deuteranopia

80826D
D1D4A6
9E95E1
505A1F
F6F8AF

Tritanopia

866E6F
DBAAAC
76E2E3
7A1A18
FEB9BD

Achromatopsia

797979
C3C3C3
C5C5C5
2B2B2B
E4E4E4

Shades & Tints Shades & Tints

#877569

Dark
Light

#DDBE9B

Dark
Light

#70EBDC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #877569;
  --color-2: #ddbe9b;
  --color-3: #70ebdc;
  --color-4: #80002d;
  --color-5: #ffe697;
}

SCSS

$color-1: #877569;
$color-2: #ddbe9b;
$color-3: #70ebdc;
$color-4: #80002d;
$color-5: #ffe697;

TAILWIND

colors: {
  'brand-1': '#877569',
  'brand-2': '#ddbe9b',
  'brand-3': '#70ebdc',
  'brand-4': '#80002d',
  'brand-5': '#ffe697',
}

RGB Array

[135, 117, 105], [221, 190, 155], [112, 235, 220], [128, 0, 45], [255, 230, 151]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This minimal-style palette of #877569, #DDBE9B, #70EBDC, #80002D, #FFE697 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #877569; --color-2: #ddbe9b; --color-3: #70ebdc; --color-4: #80002d; --color-5: #ffe697. 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. 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 minimal-style 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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