Back to palettes

Palette

Urban Crimson Pulse

A stark contrast of vivid crimson against cool urban greys and deep blues, reflecting city energy.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Urban Crimson Pulse 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 Urban Crimson Pulse.

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

Data visualization

#E63946#F1FAEE#A8DADC#457B9D#1D3557

Palette guide

How to use Urban Crimson Pulse

Overview

The Urban Crimson Pulse palette is a vibrant and dynamic collection that captures the energetic spirit of a modern city. It masterfully balances the bold, passionate crimson of #E63946 with cooler, sophisticated urban tones like the deep #1D3557 and the refreshing #A8DADC. The near-white #F1FAEE provides a clean canvas, allowing the vibrant accents to pop. This palette is perfect for designers and developers aiming to create high-impact, memorable digital experiences that convey modernity and an active pulse. It offers a clear visual hierarchy, guiding the user's eye with deliberate contrasts and a fresh, engaging feel.

Best used for

  • High-energy lifestyle brands
  • Event promotion websites
  • Modern tech startups
  • Dynamic mobile applications
  • Urban photography portfolios
  • Sports and fitness branding

Suggested color roles

primary

#1D3557 serves as a strong, grounding primary color, ideal for main navigation, footers, or robust background sections.

secondary

#457B9D offers a calming, yet sophisticated secondary tone, excellent for subheadings, secondary buttons, or data visualization elements.

accent

#E63946 is the vibrant pulse, perfect for calls-to-action, key notifications, or highlighting crucial information to grab immediate attention.

background

#F1FAEE provides a light, clean, and expansive background, ensuring excellent readability for text and allowing other colors to shine.

text

For dark text on light backgrounds, use #1D3557 or a rich charcoal. For light text on dark backgrounds, #F1FAEE is highly recommended.

Accessibility notes

  • Ensure #E63946 text has sufficient contrast on #F1FAEE backgrounds (it often does not meet AA/AAA). Use it sparingly for large text or as an accent.
  • #1D3557 text on #F1FAEE background offers excellent readability and WCAG compliance.
  • Avoid using #A8DADC for small text on #F1FAEE backgrounds due to low contrast.
  • Use a robust white or #F1FAEE for text on #1D3557 and #457B9D backgrounds.

Recommended combinations

Vibrant Call-to-Action

Perfect for primary buttons or banners, using crimson for impact against a clean base.

#F1FAEE · #E63946 · #1D3557

Cool Urban Base

Ideal for defining content sections, offering a professional and modern look.

#1D3557 · #457B9D · #F1FAEE

Energetic Highlight

Use for charts, graphs, or interactive elements where the crimson draws attention to key data points.

#A8DADC · #E63946 · #1D3557

CSS variables

:root {
  --urban-crimson-pulse-1: #E63946;
  --urban-crimson-pulse-2: #F1FAEE;
  --urban-crimson-pulse-3: #A8DADC;
  --urban-crimson-pulse-4: #457B9D;
  --urban-crimson-pulse-5: #1D3557;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "urban-crimson-pulse": {
        1: "#E63946",
        2: "#F1FAEE",
        3: "#A8DADC",
        4: "#457B9D",
        5: "#1D3557",
      }
    }
  }
}

Related searches

bold urban color schememodern red and blue paletteenergetic brand colorscity vibe web designdynamic UI color inspiration

Palette colors

Hex values

Color 1#E63946
·
Color 2#F1FAEE
·
Color 3#A8DADC
·
Color 4#457B9D
·
Color 5#1D3557
·

Accessibility

Contrast checker

1
2
3
4
5
1
3.9:1AA18
2.7:1Fail
1.1:1Fail
3:1Fail
2
3.9:1AA18
1.4:1Fail
4.3:1AA18
11.6:1AAA
3
2.7:1Fail
1.4:1Fail
3:1AA18
8.1:1AAA
4
1.1:1Fail
4.3:1AA18
3:1AA18
2.7:1Fail
5
3:1Fail
11.6:1AAA
8.1:1AAA
2.7:1Fail

Similar palettes

More like Urban Crimson Pulse

View all vibrant
Urban Alley Graffiti
Abstract Expression Burst
Sunset Metropolis
Urban Chroma
Urban Graffiti Wall
Urban Street Art