← Back to Editor

#7293B6 · #F5E7CA · #C7C6B1 · #909B63 · #515860

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

#7293B6

Azure · CadetBlue · Navy Blue

HEX
#7293B6
RGB
rgb(114, 147, 182)
HSL
hsl(211, 32%, 58%)
HSB
hsb(211, 37%, 71%)
CMYK
cmyk(37%, 19%, 0%, 29%)
Oklch
oklch(65.2% 0.064 250.3)

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

#F5E7CA

Goose Yellow · Bisque · Lemon Cream

HEX
#F5E7CA
RGB
rgb(245, 231, 202)
HSL
hsl(40, 68%, 88%)
HSB
hsb(40, 18%, 96%)
CMYK
cmyk(0%, 6%, 18%, 4%)
Oklch
oklch(93.2% 0.041 85.3)

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

#C7C6B1

Fresh Green · Silver · Sunflower

HEX
#C7C6B1
RGB
rgb(199, 198, 177)
HSL
hsl(57, 16%, 74%)
HSB
hsb(57, 11%, 78%)
CMYK
cmyk(0%, 1%, 11%, 22%)
Oklch
oklch(82.2% 0.029 104.8)

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

#909B63

Grass Green · Gray · Olive Green

HEX
#909B63
RGB
rgb(144, 155, 99)
HSL
hsl(72, 22%, 50%)
HSB
hsb(72, 36%, 61%)
CMYK
cmyk(7%, 0%, 36%, 39%)
Oklch
oklch(66.7% 0.078 117.6)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#515860

Indigo · DimGray · Charcoal

HEX
#515860
RGB
rgb(81, 88, 96)
HSL
hsl(212, 8%, 35%)
HSB
hsb(212, 16%, 38%)
CMYK
cmyk(16%, 8%, 0%, 62%)
Oklch
oklch(45.7% 0.016 251.7)

Traditional「Indigo」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7293B6
B69572

Analogous

72B5B6
7293B6
7372B6

Triadic

7293B6
B67293
93B672

Split-Comp.

7293B6
B67372
B5B672

Tetradic

7293B6
B672B5
B69572
72B673

Contrast Matrix WCAG 2.1 Contrast

7293B6
F5E7CA
C7C6B1
909B63
515860
—
2.6
Fail
1.8
Fail
1.1
Fail
2.3
Fail
2.6
Fail
—
1.4
Fail
2.4
Fail
5.9
AA
1.8
Fail
1.4
Fail
—
1.7
Fail
4.2
AA Large
1.1
Fail
2.4
Fail
1.7
Fail
—
2.4
Fail
2.3
Fail
5.9
AA
4.2
AA Large
2.4
Fail
—
White BG
3.2AA Large
1.2Fail
1.7Fail
3.0Fail
7.2AAA
Black BG
6.6AA
17.2AAA
12.1AAA
7.1AAA
2.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8081AE
EFEFD1
C7C7B6
959571
54545E

Deuteranopia

7E7CAC
F0F1D3
C7C7B7
949374
54535E

Tritanopia

74A7A5
F4D7D8
C7BABB
917B7E
515D5C

Achromatopsia

8D8D8D
E8E8E8
C4C4C4
919191
575757

Shades & Tints Shades & Tints

#7293B6

Dark
Light

#F5E7CA

Dark
Light

#C7C6B1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7293b6;
  --color-2: #f5e7ca;
  --color-3: #c7c6b1;
  --color-4: #909b63;
  --color-5: #515860;
}

SCSS

$color-1: #7293b6;
$color-2: #f5e7ca;
$color-3: #c7c6b1;
$color-4: #909b63;
$color-5: #515860;

TAILWIND

colors: {
  'brand-1': '#7293b6',
  'brand-2': '#f5e7ca',
  'brand-3': '#c7c6b1',
  'brand-4': '#909b63',
  'brand-5': '#515860',
}

RGB Array

[114, 147, 182], [245, 231, 202], [199, 198, 177], [144, 155, 99], [81, 88, 96]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7293B6, #F5E7CA, #C7C6B1, #909B63, #515860 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #7293b6; --color-2: #f5e7ca; --color-3: #c7c6b1; --color-4: #909b63; --color-5: #515860. 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 general-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Restrained colors convey professionalism and trust. 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