Back to palettes

Palette

City Rooftop Sunset

A dynamic clash of fiery sunset oranges and cool city blues, painting a vibrant urban horizon.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how City Rooftop Sunset 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 City Rooftop Sunset.

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

Data visualization

#FF6347#FFA07A#F0E68C#B0C4DE#4682B4

Palette guide

How to use City Rooftop Sunset

Overview

The "City Rooftop Sunset" palette captures the dramatic interplay of fiery sunset hues and cool urban blues, creating a vibrant and energetic aesthetic. It features a bold tomato red #FF6347, a soft coral #FFA07A, and a warm pale goldenrod #F0E68C, dynamically contrasted by a cool light steel blue #B0C4DE and a strong steel blue #4682B4. This palette offers designers and developers a versatile toolkit for creating lively, engaging interfaces, expressive branding, or captivating digital content that evokes emotion and dynamism. It’s perfect for projects aiming for a modern, expressive, and visually striking appeal.

Best used for

  • Creative agency websites
  • Travel and leisure branding
  • Event promotions and marketing
  • Fashion and lifestyle blogs
  • Mobile app onboarding screens
  • Digital art and illustration

Suggested color roles

primary

#FF6347 - A vibrant, energetic red, perfect for calls-to-action, important alerts, or bold branding.

secondary

#4682B4 - A strong, grounding steel blue, providing a cool contrast and stability for backgrounds or structural elements.

accent

#F0E68C - A warm, glowing yellow, ideal for highlights, interactive states, or subtle graphic elements.

background

#B0C4DE - A soft, light steel blue, providing a gentle canvas that allows warmer colors to pop.

text

#4682B4 - For primary body text on light backgrounds, or a crisp white for headers on darker elements.

Accessibility notes

  • Ensure #F0E68C text on light backgrounds (like white or #B0C4DE) has sufficient contrast; it's best for accents or larger display text.
  • The warmer colors like #FF6347 and #FFA07A can be challenging for text on backgrounds like #B0C4DE; use a contrast checker.
  • For body text on warmer backgrounds, use a dark blue like #4682B4 or black for optimal readability.
  • Be mindful of color combinations for colorblind users, especially with red-orange hues.

Recommended combinations

Fiery Horizon

Create warm, inviting hero sections, vibrant illustrations, or expressive headlines.

#FF6347 · #FFA07A · #F0E68C

Urban Sky

Combine cool blues with a striking red accent for modern branding or dynamic UI elements.

#4682B4 · #B0C4DE · #FF6347

Twilight Glow

A softer, more ethereal combination for backgrounds, subtle gradients, or decorative elements.

#FFA07A · #F0E68C · #B0C4DE

CSS variables

:root {
  --city-rooftop-sunset-1: #FF6347;
  --city-rooftop-sunset-2: #FFA07A;
  --city-rooftop-sunset-3: #F0E68C;
  --city-rooftop-sunset-4: #B0C4DE;
  --city-rooftop-sunset-5: #4682B4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "city-rooftop-sunset": {
        1: "#FF6347",
        2: "#FFA07A",
        3: "#F0E68C",
        4: "#B0C4DE",
        5: "#4682B4",
      }
    }
  }
}

Related searches

sunset city paletteurban vibrant colorsorange blue contrastenergetic branding paletteskyline color scheme

Palette colors

Hex values

Color 1#FF6347
·
Color 2#FFA07A
·
Color 3#F0E68C
·
Color 4#B0C4DE
·
Color 5#4682B4
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.3:1Fail
1.7:1Fail
1.4:1Fail
2
1.5:1Fail
1.6:1Fail
1.1:1Fail
2.1:1Fail
3
2.3:1Fail
1.6:1Fail
1.4:1Fail
3.2:1AA18
4
1.7:1Fail
1.1:1Fail
1.4:1Fail
2.3:1Fail
5
1.4:1Fail
2.1:1Fail
3.2:1AA18
2.3:1Fail

Similar palettes

More like City Rooftop Sunset

View all vibrant
Electric Sunset Glow
Arid Bloom Blaze
Bright Marigold Bloom
Citrus Burst Joy
Citrus Burst Splash
Citrus Burst Zest