← Back to Editor

#BDBB68 · #747A77 · #9EA9A2 · #F0E4CC · #CFCBA3

sea

A 5-color sea palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BDBB68

Autumn Sage · Tan · Sunflower

HEX
#BDBB68
RGB
rgb(189, 187, 104)
HSL
hsl(59, 39%, 57%)
HSB
hsb(59, 45%, 74%)
CMYK
cmyk(0%, 1%, 45%, 26%)
Oklch
oklch(77.6% 0.106 107.4)

TraditionalAutumn Sage」· PaintSunflower」· Creative Blush Sunrise

#747A77

Ink Gray · Gray · Warm Gray

HEX
#747A77
RGB
rgb(116, 122, 119)
HSL
hsl(150, 3%, 47%)
HSB
hsb(150, 5%, 48%)
CMYK
cmyk(5%, 0%, 2%, 52%)
Oklch
oklch(57.3% 0.009 164.7)

TraditionalInk Gray」· PaintWarm Gray」· Creative Urban Concrete

#9EA9A2

Ash · DarkGray · Silver Sand

HEX
#9EA9A2
RGB
rgb(158, 169, 162)
HSL
hsl(142, 6%, 64%)
HSB
hsb(142, 7%, 66%)
CMYK
cmyk(7%, 0%, 4%, 34%)
Oklch
oklch(72.4% 0.016 158.1)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#F0E4CC

Goose Yellow · Bisque · Lemon Cream

HEX
#F0E4CC
RGB
rgb(240, 228, 204)
HSL
hsl(40, 55%, 87%)
HSB
hsb(40, 15%, 94%)
CMYK
cmyk(0%, 5%, 15%, 6%)
Oklch
oklch(92.2% 0.034 84.6)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#CFCBA3

Fresh Green · Tan · Sunflower

HEX
#CFCBA3
RGB
rgb(207, 203, 163)
HSL
hsl(55, 31%, 73%)
HSB
hsb(55, 21%, 81%)
CMYK
cmyk(0%, 2%, 21%, 19%)
Oklch
oklch(83.5% 0.054 102.7)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BDBB68
6768BC

Analogous

BC9067
BDBB68
93BC67

Triadic

BDBB68
67BCBB
BB67BC

Split-Comp.

BDBB68
6793BC
9067BC

Tetradic

BDBB68
67BC90
6768BC
BC6793

Contrast Matrix WCAG 2.1 Contrast

BDBB68
747A77
9EA9A2
F0E4CC
CFCBA3
2.2
Fail
1.2
Fail
1.6
Fail
1.2
Fail
2.2
Fail
1.8
Fail
3.5
AA Large
2.7
Fail
1.2
Fail
1.8
Fail
1.9
Fail
1.5
Fail
1.6
Fail
3.5
AA Large
1.9
Fail
1.3
Fail
1.2
Fail
2.7
Fail
1.5
Fail
1.3
Fail
White BG
2.0Fail
4.4AA Large
2.4Fail
1.3Fail
1.7Fail
Black BG
10.5AAA
4.8AA
8.7AAA
16.7AAA
12.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BCBC7C
777778
A3A3A4
EBEBD2
CDCDAD

Deuteranopia

BCBC81
767678
A2A1A4
ECECD3
CECEAF

Tritanopia

BD8C8F
747878
9FA5A5
EFD6D7
CFB4B6

Achromatopsia

B2B2B2
787878
A5A5A5
E5E5E5
C8C8C8

Shades & Tints Shades & Tints

#BDBB68

Dark
Light

#747A77

Dark
Light

#9EA9A2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bdbb68;
  --color-2: #747a77;
  --color-3: #9ea9a2;
  --color-4: #f0e4cc;
  --color-5: #cfcba3;
}

SCSS

$color-1: #bdbb68;
$color-2: #747a77;
$color-3: #9ea9a2;
$color-4: #f0e4cc;
$color-5: #cfcba3;

TAILWIND

colors: {
  'brand-1': '#bdbb68',
  'brand-2': '#747a77',
  'brand-3': '#9ea9a2',
  'brand-4': '#f0e4cc',
  'brand-5': '#cfcba3',
}

RGB Array

[189, 187, 104], [116, 122, 119], [158, 169, 162], [240, 228, 204], [207, 203, 163]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #BDBB68, #747A77, #9EA9A2, #F0E4CC, #CFCBA3 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #bdbb68; --color-2: #747a77; --color-3: #9ea9a2; --color-4: #f0e4cc; --color-5: #cfcba3. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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