Palette

Sun-Kissed Canyon

Evokes the intense glow of a desert sunset reflecting on ancient canyon walls, with hints of dry heat.

warmenergetic5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sun-Kissed Canyon 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 Sun-Kissed Canyon.

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

Data visualization

#FCA3B7#FDBF47#FF8C36#DD574B#8B4513

Palette guide

How to use Sun-Kissed Canyon

Overview

The Sun-Kissed Canyon palette, featuring vibrant hues like `#FCA3B7`, `#FDBF47`, and the energetic `#FF8C36`, evokes the intense glow of a desert sunset reflecting on ancient canyon walls, with hints of dry heat. This dynamic collection also includes the striking `#DD574B` and the grounding `#8B4513`. It's a powerful choice for designers and developers aiming to create energetic, bold, and memorable experiences. The palette's vivid oranges, fiery reds, and warm pinks are perfect for projects that demand high visual impact and convey a sense of adventure, passion, or the vibrant beauty of natural phenomena, making designs truly stand out.

Best used for

Energetic and adventurous brand identities
Travel and tourism promotions, especially for desert destinations
Event branding for festivals or outdoor gatherings
Bold digital art and illustration
E-commerce sites for activewear or vibrant lifestyle products
Marketing materials that need to convey excitement and warmth

Suggested color roles

primary

Use `#FF8C36` as a dominant, energetic primary color for main calls-to-action, headlines, and key visual elements to grab attention.

secondary

Employ `#DD574B` for supporting headlines, important statistics, or as a strong accent color that maintains the palette's vibrancy.

accent

Apply `#FDBF47` for bright highlights, interactive states, or decorative elements where a luminous, sunny pop is desired.

background

The soft `#FCA3B7` provides a gentle, warm backdrop for content areas, allowing the more vibrant colors to truly shine.

text

For optimal readability, use `#8B4513` for body text and crucial labels, providing a deep, grounding contrast against lighter colors.

Accessibility notes

Ensure sufficient contrast for text, particularly when using vibrant colors like `#FDBF47` or `#FCA3B7` on light backgrounds. A dark text like `#8B4513` is crucial.
Avoid placing `#FCA3B7` text directly on `#DD574B` or `#FF8C36` as the contrast might be insufficient for WCAG AA.
Interactive elements must have clear focus/hover states. Buttons with `#FF8C36` should use contrasting text, like white or `#8B4513`.
For all body text, prioritize using `#8B4513` to maximize readability across various screen types and lighting conditions.

Recommended combinations

Sunset Glow

A soft, warm background with a vibrant primary action color and a deep, grounding text for high contrast.

#FCA3B7 · #FF8C36 · #8B4513

Fiery Contrast

A rich red base accented by a bright golden yellow, with a dark brown for impactful details or text.

#DD574B · #FDBF47 · #8B4513

Vibrant Energy

Dominant orange paired with a soft pink for balance, and a strong red for emphasis or secondary actions.

#FF8C36 · #FCA3B7 · #DD574B

CSS variables

:root {
  --sun-kissed-canyon-1: #FCA3B7;
  --sun-kissed-canyon-2: #FDBF47;
  --sun-kissed-canyon-3: #FF8C36;
  --sun-kissed-canyon-4: #DD574B;
  --sun-kissed-canyon-5: #8B4513;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sun-kissed-canyon": {
        1: "#FCA3B7",
        2: "#FDBF47",
        3: "#FF8C36",
        4: "#DD574B",
        5: "#8B4513",
      }
    }
  }
}

Hex values

Color 1#FCA3B7

Color 2#FDBF47

Color 3#FF8C36

Color 4#DD574B

Color 5#8B4513

Accessibility

Contrast checker

1.1:1Fail

1.2:1Fail

2:1Fail

3.7:1AA18

1.1:1Fail

1.4:1Fail

2.3:1Fail

4.3:1AA18

1.2:1Fail

1.4:1Fail

1.6:1Fail

3.1:1AA18

2:1Fail

2.3:1Fail

1.6:1Fail

1.9:1Fail

3.7:1AA18

4.3:1AA18

3.1:1AA18

1.9:1Fail

Similar palettes

More like Sun-Kissed Canyon