Neon Botanical Rise

Luminous greens and cool teals clash against warm coral accents, creating a sun-drenched yet refreshing visual tension.

Colors

~Ripe Malinka#F4516C
~Tangerine Tango#FF9D4F
~Banana Bombshell#F1E83F
~Walking on Sunshine#F1FF9F
~Jubilant Jade#56AB7F
~Paradisiacal Getaway#82DDEF
~Way Beyond the Blue#168BC9
~Night Snow#BCC5FF

Psychology

The palette anchors itself in cool green and teal tones that recede visually, creating a calm foundation, while the vivid warm pinks and oranges advance and command attention, producing a dynamic push-pull effect. This complementary opposition between warm and cool families generates visual excitement without harshness, as the moderate contrast prevents overwhelming saturation. The light, airy quality of most hues suggests openness and optimism, yet the bold warmth keeps the mood energetic rather than passive.

Usage

Ideal for eco-conscious brand identities, modern SaaS dashboards, and editorial layouts that need to balance approachability with sophistication. The moderate contrast and cool dominance work well for health and wellness packaging, sustainable fashion campaigns, and lifestyle photography where freshness and energy must coexist without visual fatigue.
Projects requiring both playful engagement and cool professionalism benefit from this palette's unique balance of boldness and restraint.

Code

CSS Gradient
/* CSS gradient approximation of mesh gradient */
/* Note: This is a linear approximation. For the full animated mesh effect, use the React/JS export. */
background: linear-gradient(
    90deg,
    #f4516c 0%,
    #ff9d4f 14%,
    #f1e83f 29%,
    #f1ff9f 43%,
    #56ab7f 57%,
    #82ddef 71%,
    #168bc9 86%,
    #bcc5ff 100%
  );
Tailwind v4
/* app.css — Tailwind v4 */
@theme {
  --color-gradient-1: #f4516c;
  --color-gradient-2: #ff9d4f;
  --color-gradient-3: #f1e83f;
  --color-gradient-4: #f1ff9f;
  --color-gradient-5: #56ab7f;
  --color-gradient-6: #82ddef;
  --color-gradient-7: #168bc9;
  --color-gradient-8: #bcc5ff;
}

/* Usage: bg-gradient-1, text-gradient-2, etc. */
CSS Variables
--color-1: #f4516c;
--color-2: #ff9d4f;
--color-3: #f1e83f;
--color-4: #f1ff9f;
--color-5: #56ab7f;
--color-6: #82ddef;
--color-7: #168bc9;
--color-8: #bcc5ff;
Hex values
#f4516c, #ff9d4f, #f1e83f, #f1ff9f, #56ab7f, #82ddef, #168bc9, #bcc5ff

Building something? Get this palette via the REST API.

History

Similar palettes

Jade Hour Glow
Neon Bloom Dusk
Shallow Waters
Indigo Hour Study
Pastel Lagoon
Pastel Lagoon Study
Blackberry Bakery Noon
Celadon Reverie
Butter Meadow Soft