← Back to Editor

#B3D9E2 · #95A288 · #7B7948 · #483306 · #896253

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

#B3D9E2

Sky Blue · LightBlue · Glacier Blue

HEX
#B3D9E2
RGB
rgb(179, 217, 226)
HSL
hsl(191, 45%, 79%)
HSB
hsb(191, 21%, 89%)
CMYK
cmyk(21%, 4%, 0%, 11%)
Oklch
oklch(86.1% 0.042 213.7)

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

#95A288

Celadon · DarkSeaGreen · Olive Green

HEX
#95A288
RGB
rgb(149, 162, 136)
HSL
hsl(90, 12%, 58%)
HSB
hsb(90, 16%, 64%)
CMYK
cmyk(8%, 0%, 16%, 36%)
Oklch
oklch(69.5% 0.040 129.1)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#7B7948

Autumn Sage · DimGray · Honey Gold

HEX
#7B7948
RGB
rgb(123, 121, 72)
HSL
hsl(58, 26%, 38%)
HSB
hsb(58, 41%, 48%)
CMYK
cmyk(0%, 2%, 41%, 52%)
Oklch
oklch(56.6% 0.069 106.4)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#483306

Ochre · DarkOliveGreen · Amber Gold

HEX
#483306
RGB
rgb(72, 51, 6)
HSL
hsl(41, 85%, 15%)
HSB
hsb(41, 92%, 28%)
CMYK
cmyk(0%, 29%, 92%, 72%)
Oklch
oklch(33.7% 0.065 81.2)

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

#896253

Tangerine · DimGray · Amber Brown

HEX
#896253
RGB
rgb(137, 98, 83)
HSL
hsl(17, 25%, 43%)
HSB
hsb(17, 39%, 54%)
CMYK
cmyk(0%, 28%, 39%, 46%)
Oklch
oklch(53.3% 0.056 41.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B3D9E2
E2BAB1

Analogous

B1E2D2
B3D9E2
B1C1E2

Triadic

B3D9E2
E2B1D9
D9E2B1

Split-Comp.

B3D9E2
E2B1C1
E2D2B1

Tetradic

B3D9E2
D2B1E2
E2BAB1
C1E2B1

Contrast Matrix WCAG 2.1 Contrast

B3D9E2
95A288
7B7948
483306
896253
—
1.8
Fail
3.0
Fail
8.0
AAA
3.5
AA Large
1.8
Fail
—
1.7
Fail
4.5
AA Large
2.0
Fail
3.0
Fail
1.7
Fail
—
2.7
Fail
1.2
Fail
8.0
AAA
4.5
AA Large
2.7
Fail
—
2.2
Fail
3.5
AA Large
2.0
Fail
1.2
Fail
2.2
Fail
—
White BG
1.5Fail
2.7Fail
4.5AA Large
12.0AAA
5.3AA
Black BG
13.9AAA
7.8AAA
4.7AA
1.8Fail
3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C3C4E0
9B9B8E
7A7A54
3F3F11
787857

Deuteranopia

C1BEDF
9A9990
7A7A57
404214
7A7D58

Tritanopia

B5DEDE
969394
7B5D5F
47191B
87595A

Achromatopsia

CFCFCF
9B9B9B
747474
343434
6C6C6C

Shades & Tints Shades & Tints

#B3D9E2

Dark
Light

#95A288

Dark
Light

#7B7948

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b3d9e2;
  --color-2: #95a288;
  --color-3: #7b7948;
  --color-4: #483306;
  --color-5: #896253;
}

SCSS

$color-1: #b3d9e2;
$color-2: #95a288;
$color-3: #7b7948;
$color-4: #483306;
$color-5: #896253;

TAILWIND

colors: {
  'brand-1': '#b3d9e2',
  'brand-2': '#95a288',
  'brand-3': '#7b7948',
  'brand-4': '#483306',
  'brand-5': '#896253',
}

RGB Array

[179, 217, 226], [149, 162, 136], [123, 121, 72], [72, 51, 6], [137, 98, 83]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B3D9E2, #95A288, #7B7948, #483306, #896253 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: #b3d9e2; --color-2: #95a288; --color-3: #7b7948; --color-4: #483306; --color-5: #896253. 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