Back to palettes

Palette

Deep Sea Coral

A lively collection of coral pinks and ocean blues, portraying a vibrant reef teeming with life.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Deep Sea Coral 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 Sea Coral.

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

Data visualization

#FF6347#FF7F50#4682B4#ADD8E6#CD5C5C

Palette guide

How to use Deep Sea Coral

Overview

The Deep Sea Coral palette (version 4) is a lively collection of coral pinks and ocean blues, portraying a vibrant reef teeming with life. It brings together the warm, energetic tones of #FF6347 and #FF7F50 with the cool, calming presence of #4682B4 and #ADD8E6. A deeper, muted coral #CD5C5C adds richness and balance. This palette is perfect for designs that aim to be cheerful, inviting, and dynamic, evoking the beauty of a sun-drenched underwater world. It's particularly effective for creating visually appealing interfaces with a playful yet sophisticated touch.

Best used for

  • Beach resort marketing
  • Children's educational content
  • Summer fashion branding
  • Healthy food packaging
  • Creative blog designs
  • Event invitations (tropical)

Suggested color roles

primary

#FF6347 (A vibrant, energetic coral, ideal for calls to action, main headings, or primary brand color.)

secondary

#4682B4 (A calming steel blue, suitable for backgrounds, navigation, or balancing the warmer tones.)

accent

#ADD8E6 (A light, airy blue, perfect for subtle highlights, interactive elements, or a fresh touch.)

background

#ADD8E6 (A light, serene blue, providing a clean and refreshing canvas for the vibrant corals.)

text

#4682B4 (Excellent for primary body text on light backgrounds like #ADD8E6. For headings, #FF6347 provides a bold, eye-catching option.)

Accessibility notes

  • Ensure #FF6347 and #CD5C5C have sufficient contrast when used as text on lighter backgrounds like #ADD8E6.
  • #4682B4 provides good contrast for text on #ADD8E6.
  • Avoid using #FF7F50 as body text on light backgrounds without careful contrast checking.
  • The warmth of the corals and coolness of the blues creates distinct visual separation, aiding in hierarchy.

Recommended combinations

Reef Vibrance

Energetic coral tones for vibrant accents and warm sections.

#FF6347 · #FF7F50 · #CD5C5C

Oceanic Breeze

Calming blues with a pop of coral for a balanced, fresh look.

#4682B4 · #ADD8E6 · #FF6347

Playful Contrast

Light background with strong coral and blue for clear hierarchy and visual appeal.

#ADD8E6 · #FF6347 · #4682B4

CSS variables

:root {
  --deep-sea-coral-4-1: #FF6347;
  --deep-sea-coral-4-2: #FF7F50;
  --deep-sea-coral-4-3: #4682B4;
  --deep-sea-coral-4-4: #ADD8E6;
  --deep-sea-coral-4-5: #CD5C5C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-sea-coral-4": {
        1: "#FF6347",
        2: "#FF7F50",
        3: "#4682B4",
        4: "#ADD8E6",
        5: "#CD5C5C",
      }
    }
  }
}

Related searches

coral blue color palettevibrant summer colorsunderwater reef themeplayful web design colorsbeach inspired palette

Palette colors

Hex values

Color 1#FF6347
·
Color 2#FF7F50
·
Color 3#4682B4
·
Color 4#ADD8E6
·
Color 5#CD5C5C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.4:1Fail
1.9:1Fail
1.3:1Fail
2
1.2:1Fail
1.6:1Fail
1.6:1Fail
1.6:1Fail
3
1.4:1Fail
1.6:1Fail
2.7:1Fail
1:1Fail
4
1.9:1Fail
1.6:1Fail
2.7:1Fail
2.6:1Fail
5
1.3:1Fail
1.6:1Fail
1:1Fail
2.6:1Fail

Similar palettes

More like Deep Sea Coral

View all vibrant