Forest Trail

This palette contains 5 colors: #1B4332, #2D6A4F, #52B788, #95D5B2, #D8F3DC. Click on any color swatch above to explore its full detail page.

Define CSS custom properties for each color: --color-1: #HEX; then reference them throughout your stylesheet. Click "Copy all hex codes" above to get all values at once.

Use this palette as a starting point. Click any color to visit its detail page where you'll find shades (lighter and darker variations), harmonies (complementary, analogous, triadic), and tools to generate related colors.

Each color card shows HEX and RGB values. Click through to the color detail page for additional formats including HSL, HSV, CMYK, and OKLCH — covering web, print, and modern CSS needs.

Accessibility depends on how you pair colors. Each color's detail page shows WCAG contrast ratios. Use our Contrast Checker to test any two palette colors together for AA/AAA compliance.

Click the "Copy all hex codes" button above the FAQ section. This copies all 5 hex values as a comma-separated list to your clipboard.

HEX codes work in virtually every design tool — Figma, Sketch, Adobe XD, Photoshop, Illustrator, Canva, and CSS. Copy a code from this page and paste it directly into the color picker of your preferred tool.

Our curated palettes are designed based on color theory principles — complementary, analogous, or thematic relationships. Each palette is tested for visual harmony and practical usability in UI and graphic design.

Absolutely. All colors are provided as HEX codes ready for CSS. For a Tailwind-style workflow, use our Shade Generator to create 50–950 shade scales from any palette color.

Browse our full collection on the Palettes page. You can also generate custom palettes from any color using the Palette Generator tool.