#6291BD + #AAC2A0 + #E3D8D8 + #FF9500 + #D61E1E · sunset - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#6291BD

Slate Blue · CadetBlue · Navy Blue

HEX

#6291BD

RGB

rgb(98, 145, 189)

HSL

hsl(209, 41%, 56%)

HSB

hsb(209, 48%, 74%)

CMYK

cmyk(48%, 23%, 0%, 26%)

Oklch

oklch(64.1% 0.084 247.7)

Traditional「Slate Blue」· Paint「Navy Blue」· Creative Blush Sunrise

#AAC2A0

Celadon · DarkGray · Apple Green

HEX

#AAC2A0

RGB

rgb(170, 194, 160)

HSL

hsl(102, 22%, 69%)

HSB

hsb(102, 18%, 76%)

CMYK

cmyk(12%, 0%, 18%, 24%)

Oklch

oklch(78.7% 0.054 136.5)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#E3D8D8

Peach Pink · LightGray · Cherry Blossom

HEX

#E3D8D8

RGB

rgb(227, 216, 216)

HSL

hsl(0, 16%, 87%)

HSB

hsb(0, 5%, 89%)

CMYK

cmyk(0%, 5%, 5%, 11%)

Oklch

oklch(89.1% 0.012 17.4)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#FF9500

Ochre · Orange · Amber Brown

HEX

#FF9500

RGB

rgb(255, 149, 0)

HSL

hsl(35, 100%, 50%)

HSB

hsb(35, 100%, 100%)

CMYK

cmyk(0%, 42%, 100%, 0%)

Oklch

oklch(76.5% 0.175 62.6)

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

#D61E1E

Vermilion · Crimson · Passion Red

HEX

#D61E1E

RGB

rgb(214, 30, 30)

HSL

hsl(0, 75%, 48%)

HSB

hsb(0, 86%, 84%)

CMYK

cmyk(0%, 86%, 86%, 16%)

Oklch

oklch(56.1% 0.215 27.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6291BD

BD8D61

Analogous

61BDBB

6291BD

6162BD

Triadic

6291BD

BD6190

90BD61

Split-Comp.

6291BD

BD6162

BDBB61

Tetradic

6291BD

BB61BD

BD8D61

62BD61

Contrast Matrix WCAG 2.1 Contrast

6291BD	AAC2A0	E3D8D8	FF9500	D61E1E
—	1.7 Fail	2.4 Fail	1.5 Fail	1.6 Fail
1.7 Fail	—	1.4 Fail	1.1 Fail	2.7 Fail
2.4 Fail	1.4 Fail	—	1.6 Fail	3.7 AA Large
1.5 Fail	1.1 Fail	1.6 Fail	—	2.4 Fail
1.6 Fail	2.7 Fail	3.7 AA Large	2.4 Fail	—

White BG

3.3AA Large

1.9Fail

1.4Fail

2.2Fail

5.2AA

Black BG

6.3AA

10.9AAA

15.1AAA

9.6AAA

4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

7677B2

B4B5A8

DEDED8

D1D024

86851E

Deuteranopia

7470B0

B3B1AA

DFE0D8

D7DF2D

919F1E

Tritanopia

64AAA8

ABAFB0

E2D8D8

FA4147

CD1E1E

Achromatopsia

888888

B7B7B7

DBDBDB

A4A4A4

555555

Shades & Tints Shades & Tints

#6291BD

Dark

Light

#AAC2A0

Dark

Light

#E3D8D8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6291bd;
  --color-2: #aac2a0;
  --color-3: #e3d8d8;
  --color-4: #ff9500;
  --color-5: #d61e1e;
}

SCSS

$color-1: #6291bd;
$color-2: #aac2a0;
$color-3: #e3d8d8;
$color-4: #ff9500;
$color-5: #d61e1e;

TAILWIND

colors: {
  'brand-1': '#6291bd',
  'brand-2': '#aac2a0',
  'brand-3': '#e3d8d8',
  'brand-4': '#ff9500',
  'brand-5': '#d61e1e',
}

RGB Array

[98, 145, 189], [170, 194, 160], [227, 216, 216], [255, 149, 0], [214, 30, 30]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #6291BD, #AAC2A0, #E3D8D8, #FF9500, #D61E1E 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: #6291bd; --color-2: #aac2a0; --color-3: #e3d8d8; --color-4: #ff9500; --color-5: #d61e1e. 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 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