A favicon of LeafyGreen Design System

LeafyGreen Design System

Access an open-source design system with UI components, foundational guidelines, and accessibility resources to create intuitive and beautiful user experiences.

Visit LeafyGreen Design System
A screenshot of LeafyGreen Design SystemVisit

LeafyGreen Design System is MongoDB’s open-source solution for creating intuitive and beautiful user experiences. It provides a comprehensive set of tools and guidelines to ensure consistency and quality in digital product development.

The system features an extensive library of UI Components, ready for immediate use. These are organized into practical categories such as:

  • Navigation
  • Notifications
  • Modals
  • Display elements
  • Form inputs
  • Common UI Patterns

Core visual and interactive principles are defined in its Foundations. This includes guidance on:

  • Typography for clarity and hierarchy.
  • A comprehensive Iconography library.
  • A defined Color Palette for branding and accessibility.

Additionally, LeafyGreen offers Resources like accessibility guidelines and icon creation guides. This helps teams build inclusive and polished products efficiently, maintain brand consistency, and deliver high-quality user interfaces.

Share:

Similar to LeafyGreen Design System:

Design 10x faster. Build scalable UIs. Your complete Figma toolkit.
Figma
Build websites and apps faster with a comprehensive Figma UI kit. Offers 3.5k+ components, 460+ layouts, and 70+ templates for efficient, scalable design.
Design with clarity. Build with confidence.
CompanyFigma+1 more
Ship quality Atlassian interfaces using robust foundations, versatile components, and powerful tools. Design with clarity and build with confidence.
Build cohesive experiences, faster.
Adobe XDCompany+2 more
Develop cohesive applications faster with a rich library of design components, patterns, and tools. Achieve consistency and improve team productivity.

Command Menu