Forest Color Palette

Updated April 17, 2026

A lush forest color palette — mossy green, deep emerald, bark brown, and sunlit leaf. Hex codes ready for nature-inspired designs.

The Forest Palette

• Mist #F0FDF4 rgb(240, 253, 244) hsl(138, 76%, 97%)
• New Leaf #BBF7D0 rgb(187, 247, 208) hsl(141, 79%, 85%)
• Forest Green #22C55E rgb(34, 197, 94) hsl(142, 71%, 45%)
• Moss #15803D rgb(21, 128, 61) hsl(142, 72%, 29%)
• Bark #78350F rgb(120, 53, 15) hsl(22, 78%, 26%)
• Forest Floor #1C1917 rgb(28, 25, 23) hsl(24, 10%, 10%)

Hex Codes at a Glance

#F0FDF4, #BBF7D0, #22C55E, #15803D, #78350F, #1C1917

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 forest 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.