Palette

Coral Reef Bloom

A joyful explosion of coral pinks and oranges, like a thriving, colorful coral reef.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FF6347#FFA07A#FF7F50#FFC0CB#FFDAB9

Palette guide

How to use Coral Reef Bloom

Overview

The Coral Reef Bloom palette is an exuberant celebration of warm, vibrant corals and soft, blooming pinks, echoing the lively spectacle of a thriving coral ecosystem. Featuring dynamic shades like #FF6347 (Tomato) and #FF7F50 (Coral), it's softened by the gentle #FFA07A (Light Salmon), #FFC0CB (Pink), and the creamy #FFDAB9 (Peach Puff). This palette is perfect for designers and developers aiming to create energetic, joyful, and visually engaging experiences. It's ideal for projects that demand a lively, inviting, and slightly tropical feel, from e-commerce to event branding, promising a burst of cheerful warmth.

Best used for

Tropical or beach-themed events and marketing
Summer fashion or beauty product launches
Children's parties and playful branding
Vibrant e-commerce sites for gifts or crafts
Food and beverage promotions (e.g., fruit juices)
Lively blog or social media graphics

Suggested color roles

primary

Use #FF6347 as a bold, energetic primary for hero sections, prominent calls-to-action, or key branding elements.

secondary

Apply #FF7F50 for secondary buttons, navigation, or to add depth while maintaining the vibrant coral theme.

accent

Highlight important details or create a soft, inviting pop with #FFC0CB, balancing the intensity of the deeper corals.

background

Utilize #FFDAB9 for light, warm backgrounds, providing a clean yet inviting canvas that lets other colors shine.

text

For body text, a dark brown or black (e.g., #4C2F2F or #222222) is recommended. White text works exceptionally well on #FF6347 and #FF7F50.

Accessibility notes

Ensure strong contrast for text; white text is highly recommended on #FF6347, #FF7F50, and #FFA07A.
Avoid using #FFC0CB or #FFDAB9 for small text on light backgrounds due to low contrast.
When using #FFDAB9 as a background, ensure text is very dark to meet WCAG contrast guidelines.
The vibrant nature of this palette can be intense; use lighter shades for balance and white space generously.

Recommended combinations

Energetic UI

Creates a lively, engaging interface with clear calls-to-action.

#FFDAB9 · #FF6347 · #FF7F50

Tropical Bloom

Ideal for vibrant illustrations, headers, or playful design elements.

#FFA07A · #FFC0CB · #FF6347

Warm Gradient

Forms a smooth, inviting gradient for backgrounds or visual brand assets.

#FFDAB9 · #FFA07A · #FF7F50

CSS variables

:root {
  --coral-reef-bloom-2-1: #FF6347;
  --coral-reef-bloom-2-2: #FFA07A;
  --coral-reef-bloom-2-3: #FF7F50;
  --coral-reef-bloom-2-4: #FFC0CB;
  --coral-reef-bloom-2-5: #FFDAB9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "coral-reef-bloom-2": {
        1: "#FF6347",
        2: "#FFA07A",
        3: "#FF7F50",
        4: "#FFC0CB",
        5: "#FFDAB9",
      }
    }
  }
}

Hex values

Color 1#FF6347

Color 2#FFA07A

Color 3#FF7F50

Color 4#FFC0CB

Color 5#FFDAB9

Accessibility

Contrast checker

1.5:1Fail

1.2:1Fail

1.9:1Fail

2.2:1Fail

1.5:1Fail

1.3:1Fail

1.5:1Fail

1.2:1Fail

1.3:1Fail

1.6:1Fail

1.9:1Fail

1.3:1Fail

1.6:1Fail

1.2:1Fail

2.2:1Fail

1.5:1Fail

1.9:1Fail

1.2:1Fail

Similar palettes

More like Coral Reef Bloom

Coral Reef Bloom

See it in context.

Ready when you are.

Built with Coral Reef Bloom.

How to use Coral Reef Bloom

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Energetic UI

Tropical Bloom

Warm Gradient

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Coral Reef Bloom