Back to palettes

Palette

Sunrise Cloud Horizon

A dramatic and vivid palette, mimicking the intense colors of a spectacular sunrise sky.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sunrise Cloud Horizon 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 Sunrise Cloud Horizon.

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

Data visualization

#FFBE0B#FB5607#FF006E#8338EC#3A86FF

Palette guide

How to use Sunrise Cloud Horizon

Overview

The Sunrise Cloud Horizon palette is a dramatic and vivid collection, mimicking the intense, electrifying colors of a spectacular sunrise sky. This energetic selection features a bold spectrum from the radiant yellow #FFBE0B to the fiery orange #FB5607, the striking pink #FF006E, the deep purple #8338EC, and the vibrant blue #3A86FF. It's a palette designed for impact, perfect for projects that demand attention and convey dynamism, creativity, and a modern edge. Designers can harness these powerful hues to create memorable branding, digital interfaces, or artistic expressions that truly stand out and engage.

Best used for

  • Modern tech and startup branding
  • Creative agency websites and portfolios
  • Event branding for festivals or concerts
  • Youth-oriented product packaging
  • Digital art and abstract illustrations
  • Fashion and lifestyle content creation

Suggested color roles

primary

Use #FB5607 for primary calls to action or key headings to convey energy and urgency.

secondary

Apply #3A86FF for larger sections, interactive elements, or backgrounds where a vibrant blue is desired.

accent

Employ #FF006E or #8338EC for striking accents, hover states, or to highlight critical information.

background

A very light gray or near-white background allows these vibrant colors to pop without visual competition.

text

Black or dark charcoal for body text; white for text on darker hues like #8338EC and #3A86FF.

Accessibility notes

  • Many of these vibrant colors may have low contrast with each other; use them carefully for text.
  • #FFBE0B will require dark text (e.g., black) for readability.
  • Ensure sufficient contrast when placing #FB5607 or #FF006E against a white background for text.
  • #8338EC and #3A86FF offer good contrast for white or very light gray text.

Recommended combinations

Electric Sky

Ideal for gradients, expressive headers, or dynamic graphic elements that need to capture immediate attention.

#FFBE0B · #FB5607 · #FF006E

Deep Horizon

Excellent for creating depth and a modern, digital feel, suitable for tech interfaces or abstract art.

#FF006E · #8338EC · #3A86FF

Vibrant Contrast

A bold combination for branding, calls to action, or elements requiring high visual impact and clear separation.

#FFBE0B · #3A86FF · #FB5607

CSS variables

:root {
  --sunrise-cloud-horizon-1: #FFBE0B;
  --sunrise-cloud-horizon-2: #FB5607;
  --sunrise-cloud-horizon-3: #FF006E;
  --sunrise-cloud-horizon-4: #8338EC;
  --sunrise-cloud-horizon-5: #3A86FF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sunrise-cloud-horizon": {
        1: "#FFBE0B",
        2: "#FB5607",
        3: "#FF006E",
        4: "#8338EC",
        5: "#3A86FF",
      }
    }
  }
}

Related searches

vibrant sunrise colorsbold digital paletteenergetic sky huesmodern colorful brandingdynamic gradient scheme

Palette colors

Hex values

Color 1#FFBE0B
·
Color 2#FB5607
·
Color 3#FF006E
·
Color 4#8338EC
·
Color 5#3A86FF
·

Accessibility

Contrast checker

1
2
3
4
5
1
2:1Fail
2.3:1Fail
3.4:1AA18
2.1:1Fail
2
2:1Fail
1.2:1Fail
1.7:1Fail
1.1:1Fail
3
2.3:1Fail
1.2:1Fail
1.5:1Fail
1.1:1Fail
4
3.4:1AA18
1.7:1Fail
1.5:1Fail
1.6:1Fail
5
2.1:1Fail
1.1:1Fail
1.1:1Fail
1.6:1Fail

Similar palettes

More like Sunrise Cloud Horizon

View all vibrant