← Back to Editor

#F7DBB7 · #BDB09E · #293D57 · #120307 · #7B5A3A

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

#F7DBB7

Goose Yellow · Wheat · Peach Orange

HEX
#F7DBB7
RGB
rgb(247, 219, 183)
HSL
hsl(34, 80%, 84%)
HSB
hsb(34, 26%, 97%)
CMYK
cmyk(0%, 11%, 26%, 3%)
Oklch
oklch(90.6% 0.057 73.9)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#BDB09E

Ginger · DarkGray · Warm Sun

HEX
#BDB09E
RGB
rgb(189, 176, 158)
HSL
hsl(35, 19%, 68%)
HSB
hsb(35, 16%, 74%)
CMYK
cmyk(0%, 7%, 16%, 26%)
Oklch
oklch(76.3% 0.029 76.1)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#293D57

Indigo · DarkSlateGray · Prussian Blue

HEX
#293D57
RGB
rgb(41, 61, 87)
HSL
hsl(214, 36%, 25%)
HSB
hsb(214, 53%, 34%)
CMYK
cmyk(53%, 30%, 0%, 66%)
Oklch
oklch(35.5% 0.052 255.3)

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

#120307

Dark Violet · Black · Raspberry

HEX
#120307
RGB
rgb(18, 3, 7)
HSL
hsl(344, 71%, 4%)
HSB
hsb(344, 83%, 7%)
CMYK
cmyk(0%, 83%, 61%, 93%)
Oklch
oklch(13.2% 0.034 0.8)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#7B5A3A

Ochre · Sienna · Amber Brown

HEX
#7B5A3A
RGB
rgb(123, 90, 58)
HSL
hsl(30, 36%, 35%)
HSB
hsb(30, 53%, 48%)
CMYK
cmyk(0%, 27%, 53%, 52%)
Oklch
oklch(49.4% 0.064 64.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F7DBB7
B6D2F7

Analogous

F7BAB6
F7DBB7
F2F7B6

Triadic

F7DBB7
B6F7DB
DBB6F7

Split-Comp.

F7DBB7
B6F2F7
BAB6F7

Tetradic

F7DBB7
B6F7BA
B6D2F7
F7B6F2

Contrast Matrix WCAG 2.1 Contrast

F7DBB7
BDB09E
293D57
120307
7B5A3A
—
1.6
Fail
8.3
AAA
15.1
AAA
4.7
AA
1.6
Fail
—
5.2
AA
9.5
AAA
2.9
Fail
8.3
AAA
5.2
AA
—
1.8
Fail
1.8
Fail
15.1
AAA
9.5
AAA
1.8
Fail
—
3.2
AA Large
4.7
AA
2.9
Fail
1.8
Fail
3.2
AA Large
—
White BG
1.3Fail
2.1Fail
11.1AAA
20.2AAA
6.2AA
Black BG
15.8AAA
9.9AAA
1.9Fail
1.0Fail
3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

EBEBC0
B7B7A2
323251
0C0B06
6D6C42

Deuteranopia

EDEFC2
B8B9A3
312F4F
0C0E06
6F7144

Tritanopia

F6C7C8
BCA6A7
2A4C4B
110505
794849

Achromatopsia

DFDFDF
B2B2B2
3A3A3A
080808
606060

Shades & Tints Shades & Tints

#F7DBB7

Dark
Light

#BDB09E

Dark
Light

#293D57

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f7dbb7;
  --color-2: #bdb09e;
  --color-3: #293d57;
  --color-4: #120307;
  --color-5: #7b5a3a;
}

SCSS

$color-1: #f7dbb7;
$color-2: #bdb09e;
$color-3: #293d57;
$color-4: #120307;
$color-5: #7b5a3a;

TAILWIND

colors: {
  'brand-1': '#f7dbb7',
  'brand-2': '#bdb09e',
  'brand-3': '#293d57',
  'brand-4': '#120307',
  'brand-5': '#7b5a3a',
}

RGB Array

[247, 219, 183], [189, 176, 158], [41, 61, 87], [18, 3, 7], [123, 90, 58]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F7DBB7, #BDB09E, #293D57, #120307, #7B5A3A 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: #f7dbb7; --color-2: #bdb09e; --color-3: #293d57; --color-4: #120307; --color-5: #7b5a3a. 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