Tropical Color Palette

Updated April 17, 2026

A vibrant tropical color palette — hibiscus pink, mango yellow, palm green, and Caribbean blue. Hex codes for summer, vacation, and travel designs.

The Tropical Palette

• Mango #FDE047 rgb(253, 224, 71) hsl(50, 98%, 64%)
• Papaya #FB923C rgb(251, 146, 60) hsl(27, 96%, 61%)
• Hibiscus #EC4899 rgb(236, 72, 153) hsl(330, 81%, 60%)
• Palm #22C55E rgb(34, 197, 94) hsl(142, 71%, 45%)
• Caribbean #06B6D4 rgb(6, 182, 212) hsl(189, 94%, 43%)
• Lagoon #0284C7 rgb(2, 132, 199) hsl(200, 98%, 39%)

Hex Codes at a Glance

#FDE047, #FB923C, #EC4899, #22C55E, #06B6D4, #0284C7

How to Use This Palette

• In CSS: Paste each hex into your :root custom properties or directly into background-color / color declarations.
• In Figma or Sketch: Copy the hex into any fill or stroke color field. Save each color to your local style library for reuse across frames.
• In Tailwind CSS: Add each hex to your tailwind.config.js file inside theme.extend.colors, then use classes like bg-palette-500.
• In Procreate or Photoshop: Create a new swatch set and paste each hex value. PhotoTones Pro exports ready-to-import .swatches and .ase files.

Build Your Own Palette

This tropical palette is one of many themed palettes in the PhotoTones gallery. To build a palette from your own photo, use the free PhotoTones color palette from image generator — it extracts up to 12 hex codes per image in under a second, entirely in your browser. No signup required.