← Back to Editor

#9BBBAC · #F3EDCD · #DA9122 · #270F1C · #482C28

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

#9BBBAC

Jade · DarkGray · Apple Green

HEX
#9BBBAC
RGB
rgb(155, 187, 172)
HSL
hsl(152, 19%, 67%)
HSB
hsb(152, 17%, 73%)
CMYK
cmyk(17%, 0%, 8%, 27%)
Oklch
oklch(76.4% 0.041 165.3)

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

#F3EDCD

Fresh Green · Beige · Lemon Cream

HEX
#F3EDCD
RGB
rgb(243, 237, 205)
HSL
hsl(51, 61%, 88%)
HSB
hsb(51, 16%, 95%)
CMYK
cmyk(0%, 2%, 16%, 5%)
Oklch
oklch(94.3% 0.042 98.4)

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

#DA9122

Ochre · GoldenRod · Amber Brown

HEX
#DA9122
RGB
rgb(218, 145, 34)
HSL
hsl(36, 73%, 49%)
HSB
hsb(36, 84%, 85%)
CMYK
cmyk(0%, 33%, 84%, 15%)
Oklch
oklch(71.4% 0.144 71.1)

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

#270F1C

Rose Purple · Black · Raspberry

HEX
#270F1C
RGB
rgb(39, 15, 28)
HSL
hsl(328, 44%, 11%)
HSB
hsb(328, 62%, 15%)
CMYK
cmyk(0%, 62%, 28%, 85%)
Oklch
oklch(21.0% 0.045 348.0)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#482C28

Crimson · DarkSlateGray · Wine Red

HEX
#482C28
RGB
rgb(72, 44, 40)
HSL
hsl(8, 29%, 22%)
HSB
hsb(8, 44%, 28%)
CMYK
cmyk(0%, 39%, 44%, 72%)
Oklch
oklch(32.6% 0.043 28.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9BBBAC
BB9BAA

Analogous

9BBB9C
9BBBAC
9BBABB

Triadic

9BBBAC
AC9BBB
BBAC9B

Split-Comp.

9BBBAC
BB9BBA
BB9C9B

Tetradic

9BBBAC
9C9BBB
BB9BAA
BABB9B

Contrast Matrix WCAG 2.1 Contrast

9BBBAC
F3EDCD
DA9122
270F1C
482C28
—
1.8
Fail
1.3
Fail
8.6
AAA
6.1
AA
1.8
Fail
—
2.2
Fail
15.2
AAA
10.7
AAA
1.3
Fail
2.2
Fail
—
6.9
AA
4.8
AA
8.6
AAA
15.2
AAA
6.9
AA
—
1.4
Fail
6.1
AA
10.7
AAA
4.8
AA
1.4
Fail
—
White BG
2.1Fail
1.2Fail
2.6Fail
17.9AAA
12.6AAA
Black BG
10.1AAA
17.8AAA
8.1AAA
1.2Fail
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A9A9B0
F0F0D5
BABA3D
1D1C19
3C3C29

Deuteranopia

A7A5B1
F1F1D7
BFC443
1E2018
3E4029

Tritanopia

9DB2B3
F3DBDC
D65257
261616
472A2A

Achromatopsia

B0B0B0
EBEBEB
9A9A9A
181818
343434

Shades & Tints Shades & Tints

#9BBBAC

Dark
Light

#F3EDCD

Dark
Light

#DA9122

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9bbbac;
  --color-2: #f3edcd;
  --color-3: #da9122;
  --color-4: #270f1c;
  --color-5: #482c28;
}

SCSS

$color-1: #9bbbac;
$color-2: #f3edcd;
$color-3: #da9122;
$color-4: #270f1c;
$color-5: #482c28;

TAILWIND

colors: {
  'brand-1': '#9bbbac',
  'brand-2': '#f3edcd',
  'brand-3': '#da9122',
  'brand-4': '#270f1c',
  'brand-5': '#482c28',
}

RGB Array

[155, 187, 172], [243, 237, 205], [218, 145, 34], [39, 15, 28], [72, 44, 40]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9BBBAC, #F3EDCD, #DA9122, #270F1C, #482C28 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: #9bbbac; --color-2: #f3edcd; --color-3: #da9122; --color-4: #270f1c; --color-5: #482c28. 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