← Back to Editor

#2F2C4E · #FA7361 · #C8C297 · #B8E0CE · #B5F0EE

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

#2F2C4E

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#2F2C4E
RGB
rgb(47, 44, 78)
HSL
hsl(245, 28%, 24%)
HSB
hsb(245, 44%, 31%)
CMYK
cmyk(40%, 44%, 0%, 69%)
Oklch
oklch(31.3% 0.060 286.4)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#FA7361

Peach Pink · Coral · Coral Red

HEX
#FA7361
RGB
rgb(250, 115, 97)
HSL
hsl(7, 94%, 68%)
HSB
hsb(7, 61%, 98%)
CMYK
cmyk(0%, 54%, 61%, 2%)
Oklch
oklch(71.3% 0.169 29.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#C8C297

Fresh Green · Tan · Sunflower

HEX
#C8C297
RGB
rgb(200, 194, 151)
HSL
hsl(53, 31%, 69%)
HSB
hsb(53, 25%, 78%)
CMYK
cmyk(0%, 3%, 25%, 22%)
Oklch
oklch(80.8% 0.058 100.9)

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

#B8E0CE

Jade · LightBlue · Apple Green

HEX
#B8E0CE
RGB
rgb(184, 224, 206)
HSL
hsl(153, 39%, 80%)
HSB
hsb(153, 18%, 88%)
CMYK
cmyk(18%, 0%, 8%, 12%)
Oklch
oklch(87.3% 0.049 166.2)

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

#B5F0EE

Jade · LightBlue · Glacier Blue

HEX
#B5F0EE
RGB
rgb(181, 240, 238)
HSL
hsl(178, 66%, 83%)
HSB
hsb(178, 25%, 94%)
CMYK
cmyk(25%, 0%, 1%, 6%)
Oklch
oklch(91.5% 0.060 193.5)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2F2C4E
4B4E2C

Analogous

2C3A4E
2F2C4E
402C4E

Triadic

2F2C4E
4E2F2C
2C4E2F

Split-Comp.

2F2C4E
4E402C
3A4E2C

Tetradic

2F2C4E
4E2C3A
4B4E2C
2C4E40

Contrast Matrix WCAG 2.1 Contrast

2F2C4E
FA7361
C8C297
B8E0CE
B5F0EE
—
4.8
AA
7.3
AAA
9.2
AAA
10.5
AAA
4.8
AA
—
1.5
Fail
1.9
Fail
2.2
Fail
7.3
AAA
1.5
Fail
—
1.3
Fail
1.4
Fail
9.2
AAA
1.9
Fail
1.3
Fail
—
1.1
Fail
10.5
AAA
2.2
Fail
1.4
Fail
1.1
Fail
—
White BG
13.2AAA
2.7Fail
1.8Fail
1.4Fail
1.3Fail
Black BG
1.6Fail
7.7AAA
11.6AAA
14.6AAA
16.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2E2E46
C0BE65
C5C5A1
C9CAD2
CFCFEE

Deuteranopia

2E2E44
C7D266
C6C6A4
C7C4D3
CBC7EF

Tritanopia

2F3F3E
F3696A
C8AAAB
BAD6D7
B8EFEF

Achromatopsia

313131
999999
BFBFBF
D2D2D2
DEDEDE

Shades & Tints Shades & Tints

#2F2C4E

Dark
Light

#FA7361

Dark
Light

#C8C297

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2f2c4e;
  --color-2: #fa7361;
  --color-3: #c8c297;
  --color-4: #b8e0ce;
  --color-5: #b5f0ee;
}

SCSS

$color-1: #2f2c4e;
$color-2: #fa7361;
$color-3: #c8c297;
$color-4: #b8e0ce;
$color-5: #b5f0ee;

TAILWIND

colors: {
  'brand-1': '#2f2c4e',
  'brand-2': '#fa7361',
  'brand-3': '#c8c297',
  'brand-4': '#b8e0ce',
  'brand-5': '#b5f0ee',
}

RGB Array

[47, 44, 78], [250, 115, 97], [200, 194, 151], [184, 224, 206], [181, 240, 238]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2F2C4E, #FA7361, #C8C297, #B8E0CE, #B5F0EE is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #2f2c4e; --color-2: #fa7361; --color-3: #c8c297; --color-4: #b8e0ce; --color-5: #b5f0ee. 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. 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