Back to palettes

Palette

Ocean Reef Shimmer

Vibrant oranges and soft blues reflect the playful dance of light and color on a thriving coral reef.

vibrantplayful5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Ocean Reef Shimmer 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 Ocean Reef Shimmer.

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

Data visualization

#FF6347#FF8C69#FFA07A#ADD8E6#87CEEB

Palette guide

How to use Ocean Reef Shimmer

Overview

The Ocean Reef Shimmer palette (Vibrant) captures the playful dance of light and color on a thriving coral reef with its lively oranges and soft blues. The palette bursts with warmth from vibrant tomato red #FF6347, transitioning to the softer coral of #FF8C69 and the gentle peach of #FFA07A. These warm hues are beautifully contrasted by the cool, serene sky blue #ADD8E6 and the slightly deeper light sky blue #87CEEB, evoking sunlit waters. This collection is perfect for designers aiming to create energetic, summery, and inviting experiences. Developers will find these hex codes excellent for building engaging user interfaces that convey joy, warmth, and an active, playful spirit, suitable for travel, entertainment, or children's brands.

Best used for

  • Summer-themed marketing campaigns
  • Children's product branding
  • Travel agency websites and brochures
  • Playful mobile game interfaces
  • Event posters and promotions
  • Casual fashion or swimwear lines

Suggested color roles

primary

#FF6347 (Tomato) - Ideal for bold headlines, call-to-action buttons, or elements that demand immediate attention and energy.

secondary

#ADD8E6 (Light Blue) - Use for background sections, navigation bars, or as a calming counterpoint to the vibrant oranges.

accent

#FF8C69 (Coral) - Excellent for secondary accents, interactive elements, or graphic details to maintain warmth and vibrancy.

background

#ADD8E6 (Light Blue) - Provides a fresh, airy base, reminiscent of clear skies, making the warm tones pop.

text

A dark neutral like #333333 or even #87CEEB for headings on light backgrounds, ensuring good legibility.

Accessibility notes

  • Text in #FF6347, #FF8C69, or #FFA07A will require a very dark color (e.g., black) for readability against light backgrounds.
  • Avoid using light text on any of the orange/peach hues; contrast will be poor.
  • #ADD8E6 and #87CEEB are too light for text on white; use dark text.
  • Ensure sufficient contrast for active states and interactive elements, especially between similar warm tones.

Recommended combinations

Energetic Pop

A cool blue background with a vibrant tomato red primary accent and coral for secondary highlights, creating a lively design.

#ADD8E6 · #FF6347 · #FF8C69

Warm & Serene

A calming sky blue base with a gentle peach for softer elements and tomato red for a strong, energetic focal point.

#87CEEB · #FFA07A · #FF6347

Reef Sunset

Bold red-orange as a dominant color, soft peach for gradients, and light blue for a refreshing contrast, like a sunset over the ocean.

#FF6347 · #FFA07A · #ADD8E6

CSS variables

:root {
  --ocean-reef-shimmer-1: #FF6347;
  --ocean-reef-shimmer-2: #FF8C69;
  --ocean-reef-shimmer-3: #FFA07A;
  --ocean-reef-shimmer-4: #ADD8E6;
  --ocean-reef-shimmer-5: #87CEEB;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ocean-reef-shimmer": {
        1: "#FF6347",
        2: "#FF8C69",
        3: "#FFA07A",
        4: "#ADD8E6",
        5: "#87CEEB",
      }
    }
  }
}

Related searches

vibrant coral blue paletteplayful summer color schemeenergetic ocean theme colorsbright travel UI palettecheerful orange blue design

Palette colors

Hex values

Color 1#FF6347
·
Color 2#FF8C69
·
Color 3#FFA07A
·
Color 4#ADD8E6
·
Color 5#87CEEB
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.5:1Fail
1.9:1Fail
1.7:1Fail
2
1.3:1Fail
1.1:1Fail
1.5:1Fail
1.3:1Fail
3
1.5:1Fail
1.1:1Fail
1.3:1Fail
1.1:1Fail
4
1.9:1Fail
1.5:1Fail
1.3:1Fail
1.1:1Fail
5
1.7:1Fail
1.3:1Fail
1.1:1Fail
1.1:1Fail

Similar palettes

More like Ocean Reef Shimmer

View all vibrant
Oceanic Gem
Tropical Reef Shimmer
Aqua Coral Garden
Coral Garden Reef
Coral Lagoon Harmony
Coral Reef Bloom