← Back to Editor

#2B6082 · #F7F9B7 · #E83B33 · #072840 · #F7AC1E

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

#2B6082

Slate Blue · DarkSlateBlue · Prussian Blue

HEX
#2B6082
RGB
rgb(43, 96, 130)
HSL
hsl(203, 50%, 34%)
HSB
hsb(203, 67%, 51%)
CMYK
cmyk(67%, 26%, 0%, 49%)
Oklch
oklch(46.9% 0.079 239.6)

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

#F7F9B7

Fresh Green · Bisque · Lemon Cream

HEX
#F7F9B7
RGB
rgb(247, 249, 183)
HSL
hsl(62, 85%, 85%)
HSB
hsb(62, 27%, 98%)
CMYK
cmyk(1%, 0%, 27%, 2%)
Oklch
oklch(96.5% 0.084 109.3)

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

#E83B33

Vermilion · Crimson · Passion Red

HEX
#E83B33
RGB
rgb(232, 59, 51)
HSL
hsl(3, 80%, 55%)
HSB
hsb(3, 78%, 91%)
CMYK
cmyk(0%, 75%, 78%, 9%)
Oklch
oklch(61.5% 0.211 27.9)

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

#072840

Lake Blue · MidnightBlue · Deep Sea Blue

HEX
#072840
RGB
rgb(7, 40, 64)
HSL
hsl(205, 80%, 14%)
HSB
hsb(205, 89%, 25%)
CMYK
cmyk(89%, 38%, 0%, 75%)
Oklch
oklch(26.7% 0.058 244.8)

Traditional「Lake Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#F7AC1E

Ginger · GoldenRod · Warm Sun

HEX
#F7AC1E
RGB
rgb(247, 172, 30)
HSL
hsl(39, 93%, 54%)
HSB
hsb(39, 88%, 97%)
CMYK
cmyk(0%, 30%, 88%, 3%)
Oklch
oklch(79.7% 0.161 76.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2B6082
824D2B

Analogous

2B8278
2B6082
2B3582

Triadic

2B6082
822B61
61822B

Split-Comp.

2B6082
822B35
82782B

Tetradic

2B6082
782B82
824D2B
35822B

Contrast Matrix WCAG 2.1 Contrast

2B6082
F7F9B7
E83B33
072840
F7AC1E
—
6.2
AA
1.6
Fail
2.2
Fail
3.5
AA Large
6.2
AA
—
3.8
AA Large
13.8
AAA
1.8
Fail
1.6
Fail
3.8
AA Large
—
3.7
AA Large
2.1
Fail
2.2
Fail
13.8
AAA
3.7
AA Large
—
7.8
AAA
3.5
AA Large
1.8
Fail
2.1
Fail
7.8
AAA
—
White BG
6.8AA
1.1Fail
4.1AA Large
15.1AAA
1.9Fail
Black BG
3.1AA Large
19.2AAA
5.1AA
1.4Fail
10.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

42427A
F8F8C7
9D9C35
15163A
D7D640

Deuteranopia

3F3B78
F8F8CB
A7B435
131139
DBE049

Tritanopia

2E7372
F7D4D6
DF3637
093635
F35B61

Achromatopsia

545454
F1F1F1
6E6E6E
212121
B2B2B2

Shades & Tints Shades & Tints

#2B6082

Dark
Light

#F7F9B7

Dark
Light

#E83B33

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2b6082;
  --color-2: #f7f9b7;
  --color-3: #e83b33;
  --color-4: #072840;
  --color-5: #f7ac1e;
}

SCSS

$color-1: #2b6082;
$color-2: #f7f9b7;
$color-3: #e83b33;
$color-4: #072840;
$color-5: #f7ac1e;

TAILWIND

colors: {
  'brand-1': '#2b6082',
  'brand-2': '#f7f9b7',
  'brand-3': '#e83b33',
  'brand-4': '#072840',
  'brand-5': '#f7ac1e',
}

RGB Array

[43, 96, 130], [247, 249, 183], [232, 59, 51], [7, 40, 64], [247, 172, 30]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2B6082, #F7F9B7, #E83B33, #072840, #F7AC1E is ideal for: social media posters, mobile apps, e-commerce promos, 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: #2b6082; --color-2: #f7f9b7; --color-3: #e83b33; --color-4: #072840; --color-5: #f7ac1e. 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 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