Back to palettes

Palette

Deep Kelp Forest

A serene and immersive palette inspired by the rich greens and blues of an underwater kelp forest.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Deep Kelp Forest 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 Deep Kelp Forest.

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

Data visualization

#003333#005A5A#007D7D#00B3B3#00E6E6

Palette guide

How to use Deep Kelp Forest

Overview

The Deep Kelp Forest color palette offers a serene and immersive journey into cool, aquatic tones, perfect for designs aiming for tranquility and depth. Ranging from the profound #003333 to the vibrant #00E6E6, with harmonious mid-tones like #005A5A, #007D7D, and #00B3B3, this collection evokes the rich, verdant depths of an underwater ecosystem. Designers and developers can leverage its calming gradient for interfaces that soothe, brand identities that convey natural purity, or digital environments that feel expansive and refreshing. It's particularly effective for creating a cohesive, cool-toned aesthetic that balances subtlety with refreshing bursts of color, ensuring a sophisticated and engaging user experience across various platforms.

Best used for

  • Environmental non-profit branding or websites
  • Spa, wellness, and meditation app interfaces
  • Aquatic-themed product packaging
  • Eco-tourism or nature conservancy digital platforms
  • Tech interfaces requiring a calming, sophisticated aesthetic
  • Interior design visualization for serene spaces

Suggested color roles

primary

#003333. A deep, grounding hue ideal for main navigation, footers, or large background sections that require a strong, stable presence.

secondary

#007D7D. This mid-tone provides excellent support for card backgrounds, secondary buttons, or data visualization elements, offering a harmonious contrast.

accent

#00E6E6. A vibrant, eye-catching color perfect for calls-to-action, interactive elements, or highlighting key information, ensuring visibility.

background

#005A5A. Use this darker mid-tone for a rich, immersive background in dark mode UIs, or pair with a near-white background for subtle sectioning.

text

For dark backgrounds like #003333 or #005A5A, use pure white or a very light grey for optimal readability. For lighter backgrounds, a deep charcoal or black text is recommended.

Accessibility notes

  • Ensure sufficient contrast between #003333 text on #005A5A backgrounds, as they are close in value.
  • The bright #00E6E6 will require a very dark text color (e.g., black) to meet WCAG AA contrast standards for large text.
  • Avoid using #007D7D text on #00B3B3 backgrounds without careful contrast checks, especially for small font sizes.
  • For users with color vision deficiencies, rely on value contrast rather than hue alone when differentiating interactive elements.

Recommended combinations

Deep Contrast

Effective for hero sections with dark backgrounds, bright CTAs, and supporting text in a balanced mid-tone.

#003333 · #00E6E6 · #007D7D

Calm Gradient

Ideal for subtle section breaks, progress bars, or charts where a smooth, harmonious transition is desired.

#005A5A · #00B3B3 · #007D7D

Vibrant Accent

Use for UI components where a mid-tone base is accented by a deep header and a prominent, bright interactive element.

#007D7D · #003333 · #00E6E6

CSS variables

:root {
  --deep-kelp-forest-1: #003333;
  --deep-kelp-forest-2: #005A5A;
  --deep-kelp-forest-3: #007D7D;
  --deep-kelp-forest-4: #00B3B3;
  --deep-kelp-forest-5: #00E6E6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-kelp-forest": {
        1: "#003333",
        2: "#005A5A",
        3: "#007D7D",
        4: "#00B3B3",
        5: "#00E6E6",
      }
    }
  }
}

Related searches

teal green color schemeaquatic web design colorsocean inspired palettecalm ui colorsdeep green blue palette

Palette colors

Hex values

Color 1#003333
·
Color 2#005A5A
·
Color 3#007D7D
·
Color 4#00B3B3
·
Color 5#00E6E6
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
2.8:1Fail
5.3:1AA
8.8:1AAA
2
1.7:1Fail
1.6:1Fail
3.1:1AA18
5.2:1AA
3
2.8:1Fail
1.6:1Fail
1.9:1Fail
3.2:1AA18
4
5.3:1AA
3.1:1AA18
1.9:1Fail
1.7:1Fail
5
8.8:1AAA
5.2:1AA
3.2:1AA18
1.7:1Fail

Similar palettes

More like Deep Kelp Forest

View all cool
Abyssal Current Glide
Deep Ocean Bloom
Sapphire Reef Light
Abyssal Blue Descent
Azure Abyss Calm
Azure Canopy Light