← Back to Editor

#D83D51 · #D85F5A · #D17D4F · #CC9C57 · #CABD74

minimal

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

RestrainedProfessionalPureWarm

Industry INDUSTRY

ArchitectureManufacturingSaaS B2B

UI Context UI CONTEXT

Corporate SitePortfolioAdmin Panel

Color Details Color Details

#D83D51

Vermilion · Crimson · Passion Red

HEX
#D83D51
RGB
rgb(216, 61, 81)
HSL
hsl(352, 67%, 54%)
HSB
hsb(352, 72%, 85%)
CMYK
cmyk(0%, 72%, 63%, 15%)
Oklch
oklch(59.4% 0.191 18.2)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#D85F5A

Vermilion · Tomato · Passion Red

HEX
#D85F5A
RGB
rgb(216, 95, 90)
HSL
hsl(2, 62%, 60%)
HSB
hsb(2, 58%, 85%)
CMYK
cmyk(0%, 56%, 58%, 15%)
Oklch
oklch(63.5% 0.154 24.8)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#D17D4F

Tangerine · Coral · Warm Sun

HEX
#D17D4F
RGB
rgb(209, 125, 79)
HSL
hsl(21, 59%, 56%)
HSB
hsb(21, 62%, 82%)
CMYK
cmyk(0%, 40%, 62%, 18%)
Oklch
oklch(67.1% 0.121 48.4)

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

#CC9C57

Ginger · SandyBrown · Warm Sun

HEX
#CC9C57
RGB
rgb(204, 156, 87)
HSL
hsl(35, 53%, 57%)
HSB
hsb(35, 57%, 80%)
CMYK
cmyk(0%, 24%, 57%, 20%)
Oklch
oklch(72.4% 0.104 74.9)

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

#CABD74

Fresh Green · Tan · Sunflower

HEX
#CABD74
RGB
rgb(202, 189, 116)
HSL
hsl(51, 45%, 62%)
HSB
hsb(51, 43%, 79%)
CMYK
cmyk(0%, 6%, 43%, 21%)
Oklch
oklch(79.3% 0.095 99.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D83D51
3BD8C3

Analogous

D83B9F
D83D51
D8753B

Triadic

D83D51
50D83B
3B50D8

Split-Comp.

D83D51
3BD875
3B9FD8

Tetradic

D83D51
9FD83B
3BD8C3
753BD8

Contrast Matrix WCAG 2.1 Contrast

D83D51
D85F5A
D17D4F
CC9C57
CABD74
—
1.2
Fail
1.4
Fail
1.8
Fail
2.3
Fail
1.2
Fail
—
1.2
Fail
1.5
Fail
1.9
Fail
1.4
Fail
1.2
Fail
—
1.3
Fail
1.6
Fail
1.8
Fail
1.5
Fail
1.3
Fail
—
1.3
Fail
2.3
Fail
1.9
Fail
1.6
Fail
1.3
Fail
—
White BG
4.5AA Large
3.7AA Large
3.1AA Large
2.5Fail
1.9Fail
Black BG
4.7AA
5.7AA
6.8AA
8.5AAA
11.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

95934C
A4A35B
ADAC5A
B7B768
C4C486

Deuteranopia

9EAA4B
ABB45C
B2B85D
BABE6C
C5C68A

Tritanopia

D04848
D25C5C
CD6365
CA7578
C99497

Achromatopsia

6E6E6E
838383
919191
A2A2A2
B9B9B9

Shades & Tints Shades & Tints

#D83D51

Dark
Light

#D85F5A

Dark
Light

#D17D4F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d83d51;
  --color-2: #d85f5a;
  --color-3: #d17d4f;
  --color-4: #cc9c57;
  --color-5: #cabd74;
}

SCSS

$color-1: #d83d51;
$color-2: #d85f5a;
$color-3: #d17d4f;
$color-4: #cc9c57;
$color-5: #cabd74;

TAILWIND

colors: {
  'brand-1': '#d83d51',
  'brand-2': '#d85f5a',
  'brand-3': '#d17d4f',
  'brand-4': '#cc9c57',
  'brand-5': '#cabd74',
}

RGB Array

[216, 61, 81], [216, 95, 90], [209, 125, 79], [204, 156, 87], [202, 189, 116]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This minimal-style palette of #D83D51, #D85F5A, #D17D4F, #CC9C57, #CABD74 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: #d83d51; --color-2: #d85f5a; --color-3: #d17d4f; --color-4: #cc9c57; --color-5: #cabd74. 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 minimal-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