#7B3014 + #AC532D + #E5A056 + #85A998 + #5A8F76 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#7B3014

Tangerine · Brown · Amber Brown

HEX

#7B3014

RGB

rgb(123, 48, 20)

HSL

hsl(16, 72%, 28%)

HSB

hsb(16, 84%, 48%)

CMYK

cmyk(0%, 61%, 84%, 52%)

Oklch

oklch(41.1% 0.112 39.5)

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

#AC532D

Tangerine · Sienna · Amber Brown

HEX

#AC532D

RGB

rgb(172, 83, 45)

HSL

hsl(18, 59%, 43%)

HSB

hsb(18, 74%, 67%)

CMYK

cmyk(0%, 52%, 74%, 33%)

Oklch

oklch(54.6% 0.128 42.4)

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

#E5A056

Ginger · SandyBrown · Warm Sun

HEX

#E5A056

RGB

rgb(229, 160, 86)

HSL

hsl(31, 73%, 62%)

HSB

hsb(31, 62%, 90%)

CMYK

cmyk(0%, 30%, 62%, 10%)

Oklch

oklch(75.8% 0.122 66.0)

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

#85A998

Mineral Blue · DarkSeaGreen · Olive Green

HEX

#85A998

RGB

rgb(133, 169, 152)

HSL

hsl(152, 17%, 59%)

HSB

hsb(152, 21%, 66%)

CMYK

cmyk(21%, 0%, 10%, 34%)

Oklch

oklch(70.3% 0.047 164.7)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#5A8F76

Mineral Blue · SlateGray · Olive Green

HEX

#5A8F76

RGB

rgb(90, 143, 118)

HSL

hsl(152, 23%, 46%)

HSB

hsb(152, 37%, 56%)

CMYK

cmyk(37%, 0%, 17%, 44%)

Oklch

oklch(60.5% 0.069 163.0)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7B3014

145F7B

Analogous

7B142C

7B3014

7B6314

Triadic

7B3014

147B2F

2F147B

Split-Comp.

7B3014

147B63

142C7B

Tetradic

7B3014

2C7B14

145F7B

63147B

Contrast Matrix WCAG 2.1 Contrast

7B3014	AC532D	E5A056	85A998	5A8F76
—	1.8 Fail	4.2 AA Large	3.6 AA Large	2.5 Fail
1.8 Fail	—	2.4 Fail	2.0 Fail	1.4 Fail
4.2 AA Large	2.4 Fail	—	1.2 Fail	1.7 Fail
3.6 AA Large	2.0 Fail	1.2 Fail	—	1.4 Fail
2.5 Fail	1.4 Fail	1.7 Fail	1.4 Fail	—

White BG

9.2AAA

5.2AA

2.2Fail

2.6Fail

3.7AA Large

Black BG

2.3Fail

4.0AA Large

9.5AAA

8.1AAA

5.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5B5A1B

858536

C7C768

95959C

71717C

Deuteranopia

5F651C

8B9138

CBD06C

93909D

6E6A7E

Tritanopia

772021

A83D3F

E27679

879FA0

5D8182

Achromatopsia

434343

696969

ACACAC

9C9C9C

7C7C7C

Shades & Tints Shades & Tints

#7B3014

Dark

Light

#AC532D

Dark

Light

#E5A056

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7b3014;
  --color-2: #ac532d;
  --color-3: #e5a056;
  --color-4: #85a998;
  --color-5: #5a8f76;
}

SCSS

$color-1: #7b3014;
$color-2: #ac532d;
$color-3: #e5a056;
$color-4: #85a998;
$color-5: #5a8f76;

TAILWIND

colors: {
  'brand-1': '#7b3014',
  'brand-2': '#ac532d',
  'brand-3': '#e5a056',
  'brand-4': '#85a998',
  'brand-5': '#5a8f76',
}

RGB Array

[123, 48, 20], [172, 83, 45], [229, 160, 86], [133, 169, 152], [90, 143, 118]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #7B3014, #AC532D, #E5A056, #85A998, #5A8F76 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: #7b3014; --color-2: #ac532d; --color-3: #e5a056; --color-4: #85a998; --color-5: #5a8f76. 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 sea-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