Back to palettes

Palette

Vibrant Coral Reef

A breathtaking collection of electric oranges, teals, and pinks that mirror the kaleidoscopic beauty of a thriving coral reef.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Vibrant Coral Reef 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 Vibrant Coral Reef.

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

Data visualization

#FF6B6B#FFD166#06D6A0#118AB2#EF476F

Palette guide

How to use Vibrant Coral Reef

Overview

The "Vibrant Coral Reef" palette is a breathtaking collection of electric oranges, teals, and pinks that mirror the kaleidoscopic beauty of a thriving coral reef. It features a lively Salmon Pink (#FF6B6B), a sunny Golden Yellow (#FFD166), a refreshing Seafoam Green (#06D6A0), a deep Ocean Teal (#118AB2), and a vibrant Raspberry Pink (#EF476F). This collection is perfect for projects that evoke marine life, tropical destinations, or energetic natural themes. Designers can leverage these harmonious yet striking hues for travel branding, eco-conscious initiatives, or engaging digital content. Developers will find these hex values ideal for creating visually rich interfaces, captivating animations, and consistent themes across web and mobile applications, ensuring an immersive user experience.

Best used for

  • Tropical vacation branding
  • Marine biology educational materials
  • Summer product packaging
  • Eco-tourism websites and apps
  • Beach resort marketing
  • Children's ocean-themed products

Suggested color roles

primary

#FF6B6B provides an inviting and energetic primary, excellent for calls to action or key visual elements.

secondary

#118AB2 offers a grounding, oceanic contrast, suitable for navigation, background sections, or informational blocks.

accent

#06D6A0 delivers a refreshing, natural highlight, perfect for icons, interactive elements, or subtle design details.

background

A clean white, very light grey, or a subtle off-white would allow these vibrant colors to truly stand out.

text

For optimal legibility, use a deep black or dark charcoal on lighter backgrounds, or white on the darker palette colors like #118AB2 and #EF476F.

Accessibility notes

  • Ensure text on #FFD166, #FF6B6B, or #06D6A0 uses a dark, high-contrast color.
  • #118AB2 and #EF476F can support white or light-colored text well.
  • Avoid placing #FFD166 directly on #06D6A0 for small text due to potential low contrast.
  • Always use a color contrast analyzer for all text and interactive elements.

Recommended combinations

Reef Glow

Excellent for creating balanced, vibrant layouts, tropical-themed banners, or engaging infographics.

#FF6B6B · #FFD166 · #118AB2

Seafoam Pop

Ideal for playful illustrations, interactive elements, or adding a cheerful touch to designs.

#06D6A0 · #EF476F · #FFD166

Ocean Depth

Effective for creating depth in backgrounds, UI elements, or sophisticated visual accents.

#118AB2 · #EF476F · #FF6B6B

CSS variables

:root {
  --vibrant-coral-reef-2-1: #FF6B6B;
  --vibrant-coral-reef-2-2: #FFD166;
  --vibrant-coral-reef-2-3: #06D6A0;
  --vibrant-coral-reef-2-4: #118AB2;
  --vibrant-coral-reef-2-5: #EF476F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "vibrant-coral-reef-2": {
        1: "#FF6B6B",
        2: "#FFD166",
        3: "#06D6A0",
        4: "#118AB2",
        5: "#EF476F",
      }
    }
  }
}

Related searches

coral reef colorstropical vibrant paletteocean inspired designsummer aesthetic colorsmarine life color scheme

Palette colors

Hex values

Color 1#FF6B6B
·
Color 2#FFD166
·
Color 3#06D6A0
·
Color 4#118AB2
·
Color 5#EF476F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
1.5:1Fail
1.4:1Fail
1.3:1Fail
2
1.9:1Fail
1.3:1Fail
2.7:1Fail
2.5:1Fail
3
1.5:1Fail
1.3:1Fail
2.1:1Fail
1.9:1Fail
4
1.4:1Fail
2.7:1Fail
2.1:1Fail
1.1:1Fail
5
1.3:1Fail
2.5:1Fail
1.9:1Fail
1.1:1Fail

Similar palettes

More like Vibrant Coral Reef

View all vibrant
Coral Reef Shimmer
Tropical Reef Glow
Tropical Reef Jewel
Tropical Tide Burst
Vibrant Coral Reef
Vibrant Reef Mosaic