What are the hex codes in the Chocolate & Pistachio Sky palette?

The Chocolate & Pistachio Sky color palette consists of Espresso #381600, Chocolate #834000, Pistachio #92BC7C, Linen #F4ECE4.

How should I use the Chocolate & Pistachio Sky palette on a website?

Use Linen #F4ECE4 as the background, Espresso #381600 for text, Chocolate #834000 for buttons and links, and Pistachio #92BC7C for accents. 3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Espresso on Linen at 14:1.

Which colors in Chocolate & Pistachio Sky have enough contrast for text?

The highest-contrast pair is #381600 on #F4ECE4 with a ratio of 14:1, which passes WCAG AA for normal text.

#381600Espresso

#834000Chocolate

#92BC7CPistachio

#F4ECE4Linen

Chocolate & Pistachio Sky color palette

Dark Warm Brown Green White

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Espresso	`#381600`	`rgb(56, 22, 0)`	`hsl(24, 100%, 11%)`	`oklch(24.8% 0.064 51)`
Chocolate	`#834000`	`rgb(131, 64, 0)`	`hsl(29, 100%, 26%)`	`oklch(44.9% 0.112 54)`
Pistachio	`#92BC7C`	`rgb(146, 188, 124)`	`hsl(99, 32%, 61%)`	`oklch(74.9% 0.099 135)`
Linen	`#F4ECE4`	`rgb(244, 236, 228)`	`hsl(30, 42%, 93%)`	`oklch(94.7% 0.014 68)`

Why it works and how to use it

Chocolate & Pistachio Sky is a vivid split color palette tagged dark, warm, brown. A split scheme: Espresso plays against Linen across roughly 75° of hue. Saturation runs high, so use the brightest color sparingly and let the others carry the surface area. The overall temperature is warm.

With 4 chromatic colors, Chocolate takes the lead while the rest support. Lightness runs from 11% to 93%. Well suited to websites, presentations and branding.

Background: Linen (#F4ECE4) is the lightest color, so it belongs on large surfaces.
Text: Espresso (#381600) on #F4ECE4 gives 14:1, passing WCAG AAA.
Primary: Chocolate (#834000) is the most saturated mid-tone; use it for buttons and links (6.66:1 against the background, fine for UI elements).
Accent: Pistachio (#92BC7C) for highlights, badges and hover states.

3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Espresso on Linen at 14:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Chocolate & Pistachio Sky

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

#381600

#834000

#92BC7C

#F4ECE4

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
`#381600` on `#F4ECE4`	Aa	14:1	AAA
`#381600` on `#92BC7C`	Aa	7.57:1	AAA
`#834000` on `#F4ECE4`	Aa	6.66:1	AA
`#834000` on `#92BC7C`	Aa	3.6:1	AA large only
`#381600` on `#834000`	Aa	2.1:1	Fail
`#92BC7C` on `#F4ECE4`	Aa	1.85:1	Fail

:root {
  --espresso: #381600;
  --chocolate: #834000;
  --pistachio: #92BC7C;
  --linen: #F4ECE4;
}

$espresso: #381600;
$chocolate: #834000;
$pistachio: #92BC7C;
$linen: #F4ECE4;

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'espresso': '#381600',
        'chocolate': '#834000',
        'pistachio': '#92BC7C',
        'linen': '#F4ECE4',
      },
    },
  },
};

{
  "name": "Chocolate & Pistachio Sky",
  "colors": [
    "#381600",
    "#834000",
    "#92BC7C",
    "#F4ECE4"
  ]
}

background: linear-gradient(135deg, #381600, #834000, #92BC7C, #F4ECE4);

Or ask about it in ChatGPT Claude Perplexity

Edit this palette in the generator →

Added 2025-12-27 · Free for commercial use, no attribution needed.

Similar palettes 24 more in this mood