Back to palettes

Palette

Coral Reef Sanctuary

Lively oranges and pinks mimicking the diverse and vibrant ecosystem of a flourishing coral reef sanctuary.

VibrantEnergetic5 colors
More Vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FC775C#FF9F7C#FFC9A7#DE5D47#C04C33

Palette guide

How to use Coral Reef Sanctuary

Overview

The Coral Reef Sanctuary palette is a warm and inviting collection of coral, orange, and reddish-brown hues, perfect for projects seeking an energetic yet grounded feel. With shades like the lively #FC775C and the softer #FF9F7C, transitioning to the earthy #DE5D47 and deep #C04C33, this palette beautifully mimics the diverse ecosystem of a flourishing coral reef. The lightest tone, #FFC9A7, adds a sun-kissed touch, making it ideal for branding, digital art, or print materials that aim to evoke warmth, nature, and tropical vibrancy.

Best used for

  • Tropical-themed product packaging
  • Beachwear or swimwear branding
  • Social media graphics for travel agencies
  • Interior design concepts for coastal homes
  • Summer event invitations
  • Food and beverage packaging (fruit-based)

Suggested color roles

primary

Use the bold #DE5D47 for strong headings or calls-to-action to grab attention.

secondary

#FC775C can be effectively used for sub-sections or interactive buttons, offering warmth.

accent

#FF9F7C provides a softer highlight for details or decorative elements.

background

#FFC9A7 offers a gentle, airy backdrop, preventing the palette from becoming too heavy.

text

A dark brown or charcoal provides excellent contrast against lighter shades like #FFC9A7.

Accessibility notes

  • The lighter shades like #FF9F7C and #FFC9A7 will require very dark text for readability.
  • #FC775C may struggle for contrast with white text; test carefully.
  • Ensure sufficient contrast for all text elements, especially with the mid-tones.
  • Avoid placing light text on #FFC9A7 for accessibility.

Recommended combinations

Deep Earthy

Excellent for conveying warmth, depth, and a natural, grounded feel in branding.

#DE5D47 · #C04C33 · #FC775C

Sun-Kissed Glow

Ideal for lighter, airy designs, backgrounds, or elements needing a soft, inviting touch.

#FF9F7C · #FFC9A7 · #FC775C

Vibrant Pop

Use for energetic calls-to-action or graphic elements that need to stand out.

#FC775C · #DE5D47 · #FFC9A7

CSS variables

:root {
  --coral-reef-sanctuary-3-1: #FC775C;
  --coral-reef-sanctuary-3-2: #FF9F7C;
  --coral-reef-sanctuary-3-3: #FFC9A7;
  --coral-reef-sanctuary-3-4: #DE5D47;
  --coral-reef-sanctuary-3-5: #C04C33;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "coral-reef-sanctuary-3": {
        1: "#FC775C",
        2: "#FF9F7C",
        3: "#FFC9A7",
        4: "#DE5D47",
        5: "#C04C33",
      }
    }
  }
}

Related searches

warm coral color schemetropical reef paletteorange red nature colorsearthy coral tonesvibrant beach colors

Palette colors

Hex values

Color 1#FC775C
·
Color 2#FF9F7C
·
Color 3#FFC9A7
·
Color 4#DE5D47
·
Color 5#C04C33
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.8:1Fail
1.4:1Fail
1.8:1Fail
2
1.3:1Fail
1.3:1Fail
1.8:1Fail
2.4:1Fail
3
1.8:1Fail
1.3:1Fail
2.5:1Fail
3.3:1AA18
4
1.4:1Fail
1.8:1Fail
2.5:1Fail
1.3:1Fail
5
1.8:1Fail
2.4:1Fail
3.3:1AA18
1.3:1Fail

Similar palettes

More like Coral Reef Sanctuary

View all Vibrant