Palette
A delightful mix of juicy reds and pinks, reminiscent of a refreshing berry sorbet.
Preview
Interface
A quick look at how Sweet Berry Sorbet reads on buttons, badges, and alerts before you commit.
Marketing banner
A bolder treatment that stretches the primary and secondary colors across a full gradient banner.
Data visualization
Palette guide
The Sweet Berry Sorbet palette offers a delightful mix of juicy reds and pinks, reminiscent of a refreshing berry sorbet. This vibrant collection features energetic hues like `#E63946` (red-orange), `#F28C91` (light coral), `#FADCE0` (pale pink), `#CC2C37` (darker red), and `#B3232C` (deep red). Designers and developers can leverage these cool, fruity colors to create designs that feel fresh, cheerful, and appetizing, ideal for projects demanding a lively and invigorating aesthetic.
primary
Use `#E63946` or `#CC2C37` as a dominant, vibrant red for strong branding or main sections.
secondary
Employ `#B3232C` for a deeper, grounding red, or `#F28C91` for a softer, mid-tone complement.
accent
Apply `#FADCE0` as the palest pink accent for subtle highlights, delicate icons, or decorative touches.
background
The lightest shade, `#FADCE0`, makes an excellent soft, cool background, or pair with a crisp white.
text
Dark charcoal or `#B3232C` offers optimal readability for body text. White text works well on darker elements like `#B3232C` or `#CC2C37`.
Ideal for a refreshing background gradient, a layered product image, or a visually appealing graphic.
#B3232C · #E63946 · #FADCE0Perfect for a cheerful call-to-action, a healthy recipe highlight, or an energetic brand logo.
#CC2C37 · #F28C91 · #B3232CExcellent for soft UI elements, a vibrant product display, or summer-themed digital graphics.
#E63946 · #FADCE0 · #CC2C37:root {
--sweet-berry-sorbet-1: #E63946;
--sweet-berry-sorbet-2: #F28C91;
--sweet-berry-sorbet-3: #FADCE0;
--sweet-berry-sorbet-4: #CC2C37;
--sweet-berry-sorbet-5: #B3232C;
}theme: {
extend: {
colors: {
"sweet-berry-sorbet": {
1: "#E63946",
2: "#F28C91",
3: "#FADCE0",
4: "#CC2C37",
5: "#B3232C",
}
}
}
}Palette colors
Accessibility
Similar palettes