Palette

Frosted Evergreen Chill

Reflects the crisp, silent beauty of an evergreen forest coated in a delicate layer of winter frost.

coolminimal5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Frosted Evergreen Chill reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Frosted Evergreen Chill.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#2F4F4F#5F7F7F#8FBFBF#C7C7C7#E0E0E0

Palette guide

How to use Frosted Evergreen Chill

Overview

The Frosted Evergreen Chill palette embodies the crisp, silent beauty of a winter forest, offering a minimalist yet deep collection of cool greens and grays. From the dark, anchoring #2F4F4F to the bright, airy #E0E0E0, this palette provides a sophisticated range. The balanced #5F7F7F serves as a versatile mid-tone, while #8FBFBF introduces a lighter, icy green-gray. A neutral #C7C7C7 adds further flexibility. This palette is perfect for designs seeking a calm, modern, and understated aesthetic, reminiscent of frosted pines and serene winter landscapes.

Best used for

Corporate websites and minimalist branding
Sustainable product design and eco-friendly packaging
Winter-themed digital art and photography portfolios
Modern app dashboards and clean UI designs
Architectural presentations and interior design concepts
Brand identity focused on tranquility and resilience

Suggested color roles

primary

Utilize #5F7F7F as a balanced primary, suitable for main sections, large type, or key graphical elements, offering a cool and composed presence.

secondary

Apply #2F4F4F for strong contrasts, important headlines, or as a deep background for specific sections, providing an anchoring effect.

accent

Reserve #8FBFBF for subtle highlights, interactive elements, or delicate patterns, adding a touch of icy freshness.

background

Employ #E0E0E0 as a clean, light, and neutral background, ensuring maximum readability and an open feel.

text

Use #2F4F4F for all primary body text to ensure excellent readability and a sophisticated contrast against lighter backgrounds.

Accessibility notes

Ensure #2F4F4F text has strong contrast on #E0E0E0 and #C7C7C7 backgrounds to meet WCAG guidelines.
Avoid using #8FBFBF or #C7C7C7 for small text, as their lightness can reduce readability for some users.
Test interactive elements thoroughly to ensure hover and active states are clearly distinguishable against the neutral tones.
Consider using a stark white for text on the darkest color #2F4F4F to maximize contrast in specific design contexts.

Recommended combinations

Deep Forest

Achieve a sophisticated contrast with the deep #2F4F4F and light #E0E0E0, complemented by the balanced #5F7F7F for a modern, grounded feel.

#2F4F4F · #E0E0E0 · #5F7F7F

Icy Fresh

Combine the light #8FBFBF and #C7C7C7 with #5F7F7F to create an airy, fresh design with subtle depth, reminiscent of frosted surfaces.

#8FBFBF · #C7C7C7 · #5F7F7F

Subtle Contrast

Pair the primary #5F7F7F with an #E0E0E0 background, using #2F4F4F for impactful text or accents, creating clear hierarchy.

#5F7F7F · #E0E0E0 · #2F4F4F

CSS variables

:root {
  --frosted-evergreen-chill-1: #2F4F4F;
  --frosted-evergreen-chill-2: #5F7F7F;
  --frosted-evergreen-chill-3: #8FBFBF;
  --frosted-evergreen-chill-4: #C7C7C7;
  --frosted-evergreen-chill-5: #E0E0E0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "frosted-evergreen-chill": {
        1: "#2F4F4F",
        2: "#5F7F7F",
        3: "#8FBFBF",
        4: "#C7C7C7",
        5: "#E0E0E0",
      }
    }
  }
}

Hex values

Color 1#2F4F4F

Color 2#5F7F7F

Color 3#8FBFBF

Color 4#C7C7C7

Color 5#E0E0E0

Accessibility

Contrast checker

2.1:1Fail

4.4:1AA18

5.3:1AA

6.8:1AA

2.1:1Fail

2.6:1Fail

3.3:1AA18

4.4:1AA18

2.1:1Fail

1.2:1Fail

1.5:1Fail

5.3:1AA

2.6:1Fail

1.2:1Fail

1.3:1Fail

6.8:1AA

3.3:1AA18

1.5:1Fail

1.3:1Fail

Similar palettes

More like Frosted Evergreen Chill

Frosted Evergreen Chill

See it in context.

Ready when you are.

Built with Frosted Evergreen Chill.

How to use Frosted Evergreen Chill

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Deep Forest

Icy Fresh

Subtle Contrast

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Frosted Evergreen Chill