← Back to Editor

#EB7F54 · #B47B5B · #7D7762 · #457368 · #0D6666

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 Library

Color Details Color Details

#EB7F54

Apricot · Coral · Warm Sun

HEX
#EB7F54
RGB
rgb(235, 127, 84)
HSL
hsl(17, 79%, 63%)
HSB
hsb(17, 64%, 92%)
CMYK
cmyk(0%, 46%, 64%, 8%)
Oklch
oklch(70.9% 0.145 41.9)

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

#B47B5B

Tangerine · Gray · Warm Sun

HEX
#B47B5B
RGB
rgb(180, 123, 91)
HSL
hsl(22, 37%, 53%)
HSB
hsb(22, 49%, 71%)
CMYK
cmyk(0%, 32%, 49%, 29%)
Oklch
oklch(63.4% 0.085 50.0)

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

#7D7762

Ochre · DimGray · Honey Gold

HEX
#7D7762
RGB
rgb(125, 119, 98)
HSL
hsl(47, 12%, 44%)
HSB
hsb(47, 22%, 49%)
CMYK
cmyk(0%, 5%, 22%, 51%)
Oklch
oklch(56.9% 0.032 93.9)

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

#457368

Mineral Blue · SeaGreen · Mint Ice

HEX
#457368
RGB
rgb(69, 115, 104)
HSL
hsl(166, 25%, 36%)
HSB
hsb(166, 40%, 45%)
CMYK
cmyk(40%, 0%, 10%, 55%)
Oklch
oklch(51.9% 0.054 177.1)

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

#0D6666

Lake Blue · Teal · Peacock Green

HEX
#0D6666
RGB
rgb(13, 102, 102)
HSL
hsl(180, 77%, 23%)
HSB
hsb(180, 87%, 40%)
CMYK
cmyk(87%, 0%, 0%, 60%)
Oklch
oklch(46.4% 0.076 194.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EB7F54
56C1EB

Analogous

EB5676
EB7F54
EBCB56

Triadic

EB7F54
56EB80
8056EB

Split-Comp.

EB7F54
56EBCB
5676EB

Tetradic

EB7F54
76EB56
56C1EB
CB56EB

Contrast Matrix WCAG 2.1 Contrast

EB7F54
B47B5B
7D7762
457368
0D6666
—
1.3
Fail
1.6
Fail
2.0
Fail
2.5
Fail
1.3
Fail
—
1.3
Fail
1.5
Fail
1.9
Fail
1.6
Fail
1.3
Fail
—
1.2
Fail
1.5
Fail
2.0
Fail
1.5
Fail
1.2
Fail
—
1.3
Fail
2.5
Fail
1.9
Fail
1.5
Fail
1.3
Fail
—
White BG
2.7Fail
3.5AA Large
4.5AA Large
5.4AA
6.8AA
Black BG
7.7AAA
5.9AA
4.7AA
3.9AA Large
3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

BCBB5E
9B9B63
7A7A67
59596B
343466

Deuteranopia

C3CB61
9FA365
7B7B68
56536B
2E2866

Tritanopia

E66768
B1696A
7D6B6C
476D6D
116666

Achromatopsia

9A9A9A
888888
767676
646464
4B4B4B

Shades & Tints Shades & Tints

#EB7F54

Dark
Light

#B47B5B

Dark
Light

#7D7762

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #eb7f54;
  --color-2: #b47b5b;
  --color-3: #7d7762;
  --color-4: #457368;
  --color-5: #0d6666;
}

SCSS

$color-1: #eb7f54;
$color-2: #b47b5b;
$color-3: #7d7762;
$color-4: #457368;
$color-5: #0d6666;

TAILWIND

colors: {
  'brand-1': '#eb7f54',
  'brand-2': '#b47b5b',
  'brand-3': '#7d7762',
  'brand-4': '#457368',
  'brand-5': '#0d6666',
}

RGB Array

[235, 127, 84], [180, 123, 91], [125, 119, 98], [69, 115, 104], [13, 102, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EB7F54, #B47B5B, #7D7762, #457368, #0D6666 is ideal for: corporate websites, product showcases, portfolios. 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: #eb7f54; --color-2: #b47b5b; --color-3: #7d7762; --color-4: #457368; --color-5: #0d6666. 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. 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