← Back to Editor

#FFD7A0 · #3A8E7E · #084258 · #220E2A · #6A0936

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#FFD7A0

Goose Yellow · Wheat · Peach Orange

HEX
#FFD7A0
RGB
rgb(255, 215, 160)
HSL
hsl(35, 100%, 81%)
HSB
hsb(35, 37%, 100%)
CMYK
cmyk(0%, 16%, 37%, 0%)
Oklch
oklch(90.0% 0.083 75.2)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#3A8E7E

Mineral Blue · MediumSeaGreen · Mint Ice

HEX
#3A8E7E
RGB
rgb(58, 142, 126)
HSL
hsl(169, 42%, 39%)
HSB
hsb(169, 59%, 56%)
CMYK
cmyk(59%, 0%, 11%, 44%)
Oklch
oklch(59.1% 0.085 178.6)

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

#084258

Lake Blue · DarkSlateGray · Peacock Green

HEX
#084258
RGB
rgb(8, 66, 88)
HSL
hsl(196, 83%, 19%)
HSB
hsb(196, 91%, 35%)
CMYK
cmyk(91%, 25%, 0%, 65%)
Oklch
oklch(35.6% 0.067 229.9)

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

#220E2A

Dark Plum · Black · Dark Purple

HEX
#220E2A
RGB
rgb(34, 14, 42)
HSL
hsl(283, 50%, 11%)
HSB
hsb(283, 67%, 16%)
CMYK
cmyk(19%, 67%, 0%, 84%)
Oklch
oklch(20.9% 0.059 315.4)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

#6A0936

Dark Violet · Maroon · Raspberry

HEX
#6A0936
RGB
rgb(106, 9, 54)
HSL
hsl(332, 84%, 23%)
HSB
hsb(332, 92%, 42%)
CMYK
cmyk(0%, 92%, 49%, 58%)
Oklch
oklch(34.5% 0.131 0.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFD7A0
9EC6FF

Analogous

FFA69E
FFD7A0
F7FF9E

Triadic

FFD7A0
9EFFD7
D79EFF

Split-Comp.

FFD7A0
9EF7FF
A69EFF

Tetradic

FFD7A0
9EFFA6
9EC6FF
FF9EF7

Contrast Matrix WCAG 2.1 Contrast

FFD7A0
3A8E7E
084258
220E2A
6A0936
—
2.9
Fail
8.0
AAA
13.3
AAA
9.1
AAA
2.9
Fail
—
2.8
Fail
4.6
AA
3.1
AA Large
8.0
AAA
2.8
Fail
—
1.7
Fail
1.1
Fail
13.3
AAA
4.6
AA
1.7
Fail
—
1.5
Fail
9.1
AAA
3.1
AA Large
1.1
Fail
1.5
Fail
—
White BG
1.4Fail
3.9AA Large
10.9AAA
18.0AAA
12.3AAA
Black BG
15.5AAA
5.4AA
1.9Fail
1.2Fail
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

EEEDAD
5E5F82
212253
191923
403F2B

Deuteranopia

F0F3B1
5A5383
1E1951
1B1C22
464D29

Tritanopia

FDB8BA
3E8586
0B4E4E
211E1D
652321

Achromatopsia

DDDDDD
737373
333333
171717
2B2B2B

Shades & Tints Shades & Tints

#FFD7A0

Dark
Light

#3A8E7E

Dark
Light

#084258

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffd7a0;
  --color-2: #3a8e7e;
  --color-3: #084258;
  --color-4: #220e2a;
  --color-5: #6a0936;
}

SCSS

$color-1: #ffd7a0;
$color-2: #3a8e7e;
$color-3: #084258;
$color-4: #220e2a;
$color-5: #6a0936;

TAILWIND

colors: {
  'brand-1': '#ffd7a0',
  'brand-2': '#3a8e7e',
  'brand-3': '#084258',
  'brand-4': '#220e2a',
  'brand-5': '#6a0936',
}

RGB Array

[255, 215, 160], [58, 142, 126], [8, 66, 88], [34, 14, 42], [106, 9, 54]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFD7A0, #3A8E7E, #084258, #220E2A, #6A0936 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, 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: #ffd7a0; --color-2: #3a8e7e; --color-3: #084258; --color-4: #220e2a; --color-5: #6a0936. 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 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