Abundly Style Guide

Complete brand assets, color specifications, and design principles

📊 Presentation Template

Use our official Google Slides template for consistent brand presentation

Open Google Slides Template

Brand Color Palette

Abundly brand color palette showing the logo and color swatches

Primary Colors

Brand Primary

#24a18d

Brand Secondary

#9ed3c6

Brand Tertiary

#a2d1d6

Brand Accent

#fab5a0

Additional Colors

#9fcfd3
#cdbcf9
#fed297
#fedb91

Usage Guidelines

  • • Use primary colors for main UI elements and branding
  • • Secondary colors for backgrounds and subtle accents
  • • Tertiary colors for text and strong elements
  • • Accent colors sparingly for highlights and CTAs
  • • Maintain proper contrast ratios for accessibility

Quick Access

Logo Assets

Download logos and view usage guidelines

Style Guide API

Access complete brand guidelines programmatically

Design Principles

Visual Style

  • • Minimalist and clean layouts
  • • Modern design patterns
  • • Flat, vector-style illustrations
  • • Smooth, organic shapes
  • • Professional yet approachable

Typography

  • • Primary: Mestiza font family
  • • Clean, readable fonts
  • • Consistent hierarchy
  • • Multiple weights available
  • • Accessible font sizes

Implementation

Quick Reference

CSS Classes

bg-teal-300
text-teal-600
border-teal-600
bg-orange-400

Hex Colors

#24a18d
#9ed3c6
#a2d1d6
#fab5a0

Usage

Primary elements
Backgrounds
Text & borders
Highlights & CTAs