What are the hex codes in the Tangerine Latte & Tan palette?

The Tangerine Latte & Tan color palette consists of Latte #DB956B, Tan #E6BC89, Slate #588B8D, Smoke #F8F8F8.

How should I use the Tangerine Latte & Tan palette on a website?

Use Smoke #F8F8F8 as the background, Slate #588B8D for text, Tan #E6BC89 for buttons and links, and Latte #DB956B for accents. No pair inside the palette reaches 4.5:1, so add black or white for body text.

Which colors in Tangerine Latte & Tan have enough contrast for text?

The highest-contrast pair is #588B8D on #F8F8F8 with a ratio of 3.6:1, which passes WCAG AA for large text only.

#DB956BLatte

#E6BC89Tan

#588B8DSlate

#F8F8F8Smoke

Tangerine Latte & Tan color palette

Modern Brown Beige Gray White

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Latte	`#DB956B`	`rgb(219, 149, 107)`	`hsl(23, 61%, 64%)`	`oklch(73.0% 0.102 51)`
Tan	`#E6BC89`	`rgb(230, 188, 137)`	`hsl(33, 65%, 72%)`	`oklch(82.0% 0.082 72)`
Slate	`#588B8D`	`rgb(88, 139, 141)`	`hsl(182, 23%, 45%)`	`oklch(60.2% 0.055 199)`
Smoke	`#F8F8F8`	`rgb(248, 248, 248)`	`hsl(0, 0%, 97%)`	`oklch(97.9% 0.000 0)`

Why it works and how to use it

Tangerine Latte & Tan is a complementary color palette tagged modern, brown, beige. Latte and Slate sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. Neither washed out nor loud, it adapts to most contexts. Warm and cool hues are mixed, which adds depth.

With 3 chromatic colors, Tan takes the lead while the rest support. Lightness runs from 45% to 97%. Well suited to websites, presentations and branding.

Background: Smoke (#F8F8F8) is the lightest color, so it belongs on large surfaces.
Text: Slate (#588B8D) on #F8F8F8 gives 3.6:1, enough for large headings only.
Primary: Tan (#E6BC89) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Latte (#DB956B) for highlights, badges and hover states.

No pair inside the palette reaches 4.5:1, so add black or white for body text.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Tangerine Latte & Tan

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary

Card title

Roles are assigned by lightness.

Color blindness simulation

#DB956B

#E6BC89

#588B8D

#F8F8F8

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#588B8D` on `#F8F8F8`	Aa	3.6:1	AA large only
`#DB956B` on `#F8F8F8`	Aa	2.32:1	Fail
`#E6BC89` on `#588B8D`	Aa	2.17:1	Fail
`#E6BC89` on `#F8F8F8`	Aa	1.66:1	Fail
`#DB956B` on `#588B8D`	Aa	1.55:1	Fail
`#DB956B` on `#E6BC89`	Aa	1.4:1	Fail

Similar palettes 24 more in this mood