Back to palettes

Palette

Apricot Nectar

A delightful blend of soft oranges and peachy tones, capturing the sweet essence of ripe apricot nectar.

warmplayful5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Apricot Nectar 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 Apricot Nectar.

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

Data visualization

#FFA07A#FFC78A#FFE0B3#CC8061#FFB380

Palette guide

How to use Apricot Nectar

Overview

The Apricot Nectar palette offers a delightful blend of soft oranges and peachy tones, capturing the sweet essence of ripe apricot nectar. This playful collection spans from the vibrant #FFA07A to the delicate, warm #FFE0B3, with #FFC78A and #FFB380 providing lush, inviting transitions. Perfect for designs seeking an organic, natural, and subtly restorative aesthetic, these hex codes are ideal for wellness branding, eco-friendly web interfaces, or editorial content focused on nature. Designers and developers will find these colors excellent for crafting serene digital experiences, from herbal product sites to sustainable living platforms, where a calm, authentic aesthetic is desired.

Best used for

  • Summer branding and marketing
  • Food and beverage packaging (fruit-based)
  • Children's product design
  • Playful blog themes and social media
  • Event invitations for casual gatherings
  • Bright and cheerful app interfaces

Suggested color roles

primary

Utilize #FFA07A as a vibrant yet soft primary accent for headings, important buttons, or delicate illustrations, providing a cheerful focal point.

secondary

Employ #FFB380 for supporting elements, subheadings, or subtle background panels, offering a slightly deeper orange without losing playfulness.

accent

Apply #CC8061 for subtle decorative accents, interactive states, or delicate graphic details, providing a grounding contrast.

background

The lightest tone, #FFE0B3, is perfect as a clean, elegant background, ensuring excellent readability and a refined feel.

text

For optimal legibility, use #CC8061 or a deep charcoal against the lightest backgrounds like #FFE0B3. For secondary text, #FFA07A can be effective on lighter backgrounds.

Accessibility notes

  • Ensure #CC8061 text on #FFE0B3 background meets WCAG AA contrast standards.
  • Avoid pairing #FFC78A or #FFB380 for small text on #FFE0B3, as contrast will be too low.
  • Provide clear visual focus indicators for interactive elements, ensuring they stand out against similar background tones.
  • For critical information, consider using the darkest palette color for text on the lightest background.

Recommended combinations

Nectar Base

Provides a clean, elegant foundation for content with a pristine background and soft, romantic accents.

#FFE0B3 · #FFA07A · #FFB380

Sweet Peach

Ideal for layered UI components or subtle branding, creating depth with closely related creamy and orange tones.

#FFC78A · #CC8061 · #FFA07A

Fruity Glow

Excellent for backgrounds with a gentle luminosity or for decorative elements that need a soft, inviting sheen.

#FFB380 · #FFE0B3 · #FFC78A

CSS variables

:root {
  --apricot-nectar-1: #FFA07A;
  --apricot-nectar-2: #FFC78A;
  --apricot-nectar-3: #FFE0B3;
  --apricot-nectar-4: #CC8061;
  --apricot-nectar-5: #FFB380;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "apricot-nectar": {
        1: "#FFA07A",
        2: "#FFC78A",
        3: "#FFE0B3",
        4: "#CC8061",
        5: "#FFB380",
      }
    }
  }
}

Related searches

apricot orange palettefruit nectar colorssweet peach schemelight summer designplayful warm tones

Palette colors

Hex values

Color 1#FFA07A
·
Color 2#FFC78A
·
Color 3#FFE0B3
·
Color 4#CC8061
·
Color 5#FFB380
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.6:1Fail
1.5:1Fail
1.1:1Fail
2
1.3:1Fail
1.2:1Fail
2:1Fail
1.1:1Fail
3
1.6:1Fail
1.2:1Fail
2.4:1Fail
1.4:1Fail
4
1.5:1Fail
2:1Fail
2.4:1Fail
1.8:1Fail
5
1.1:1Fail
1.1:1Fail
1.4:1Fail
1.8:1Fail

Similar palettes

More like Apricot Nectar

View all warm