← Back to Editor

#F7F7CB · #964444 · #C9B473 · #246570 · #082A30

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

#F7F7CB

Fresh Green · Beige · Lemon Cream

HEX
#F7F7CB
RGB
rgb(247, 247, 203)
HSL
hsl(60, 73%, 88%)
HSB
hsb(60, 18%, 97%)
CMYK
cmyk(0%, 0%, 18%, 3%)
Oklch
oklch(96.5% 0.057 107.4)

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

#964444

Crimson · Sienna · Passion Red

HEX
#964444
RGB
rgb(150, 68, 68)
HSL
hsl(0, 38%, 43%)
HSB
hsb(0, 55%, 59%)
CMYK
cmyk(0%, 55%, 55%, 41%)
Oklch
oklch(49.3% 0.111 22.0)

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

#C9B473

Ginger · Tan · Sunflower

HEX
#C9B473
RGB
rgb(201, 180, 115)
HSL
hsl(45, 44%, 62%)
HSB
hsb(45, 43%, 79%)
CMYK
cmyk(0%, 10%, 43%, 21%)
Oklch
oklch(77.3% 0.088 92.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#246570

Lake Blue · DarkSlateGray · Mint Ice

HEX
#246570
RGB
rgb(36, 101, 112)
HSL
hsl(189, 51%, 29%)
HSB
hsb(189, 68%, 44%)
CMYK
cmyk(68%, 10%, 0%, 56%)
Oklch
oklch(47.1% 0.067 210.6)

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

#082A30

Lake Blue · DarkSlateGray · Peacock Green

HEX
#082A30
RGB
rgb(8, 42, 48)
HSL
hsl(189, 71%, 11%)
HSB
hsb(189, 83%, 19%)
CMYK
cmyk(83%, 13%, 0%, 81%)
Oklch
oklch(26.4% 0.039 211.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F7F7CB
CACAF7

Analogous

F7E0CA
F7F7CB
E0F7CA

Triadic

F7F7CB
CAF7F7
F7CAF7

Split-Comp.

F7F7CB
CAE0F7
E0CAF7

Tetradic

F7F7CB
CAF7E0
CACAF7
F7CAE0

Contrast Matrix WCAG 2.1 Contrast

F7F7CB
964444
C9B473
246570
082A30
—
6.0
AA
1.9
Fail
6.0
AA
13.8
AAA
6.0
AA
—
3.2
AA Large
1.0
Fail
2.3
Fail
1.9
Fail
3.2
AA Large
—
3.2
AA Large
7.4
AAA
6.0
AA
1.0
Fail
3.2
AA Large
—
2.3
Fail
13.8
AAA
2.3
Fail
7.4
AAA
2.3
Fail
—
White BG
1.1Fail
6.5AA
2.0Fail
6.6AA
15.2AAA
Black BG
19.1AAA
3.2AA Large
10.3AAA
3.2AA Large
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F7F7D6
727244
C0C083
40416D
17172F

Deuteranopia

F7F7D8
777D44
C1C387
3C386D
15122E

Tritanopia

F7DEE0
924444
C88F92
276B6B
0A2D2D

Achromatopsia

F2F2F2
5D5D5D
B3B3B3
535353
212121

Shades & Tints Shades & Tints

#F7F7CB

Dark
Light

#964444

Dark
Light

#C9B473

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f7f7cb;
  --color-2: #964444;
  --color-3: #c9b473;
  --color-4: #246570;
  --color-5: #082a30;
}

SCSS

$color-1: #f7f7cb;
$color-2: #964444;
$color-3: #c9b473;
$color-4: #246570;
$color-5: #082a30;

TAILWIND

colors: {
  'brand-1': '#f7f7cb',
  'brand-2': '#964444',
  'brand-3': '#c9b473',
  'brand-4': '#246570',
  'brand-5': '#082a30',
}

RGB Array

[247, 247, 203], [150, 68, 68], [201, 180, 115], [36, 101, 112], [8, 42, 48]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F7F7CB, #964444, #C9B473, #246570, #082A30 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: #f7f7cb; --color-2: #964444; --color-3: #c9b473; --color-4: #246570; --color-5: #082a30. 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