Design Systems

Explore comprehensive design systems and component libraries from industry leaders. Learn from Material Design, iOS Human Interface Guidelines, Fluent, Carbon, and other world-class design systems. Build consistent products with reusable components.

Showing 14 of 14 resources
Free

Material Design

Material is a design system – backed by open-source code – that helps teams build high-quality digital experiences. *Google*

Design Systems
Free

Fluent

Fluent is an open-source, cross-platform design system that gives designers and developers the frameworks they need to create engaging product experiences—accessibility, internationalization, and performance included. *Microsoft*

Design Systems
Free

Human Interface Guidelines

Get in-depth information and UI resources for designing great apps that integrate seamlessly with Apple platforms. *Apple*

Design Systems
Free

Lightning Design System

Salesforce Lightning Design System. Create the world’s best enterprise app experiences. *Salesforce*

Design Systems
Free

Atlassian

Use Atlassian’s end-to-end design language to create simple, intuitive and beautiful experiences.

Design Systems
Free

Evergreen

Evergreen is a React UI Framework for building ambitious products on the web. Brought to you by Segment.

Design Systems
Free

Carbon

This is the guiding ethos behind IBM’s design philosophy and principles. This helps us distinguish every element and every experience Designed by IBM. *IBM*

Design Systems
Free

Mozilla Protocol

Protocol is a design system for Mozilla and Firefox websites. It establishes a common design language, provides reusable coded components, and outlines high level guidelines for content and accessibility. *Mozilla*

Design Systems
Free

Polaris

Our design system helps us work together to build a great experience for all of Shopify’s merchants. *Shopify*

Design Systems
Free

Primer

Primer was created for GitHub by GitHub. We love it so much, we chose to open-source it to allow the community to design and build their own projects with Primer. *Github*

Design Systems
Free

Solid

Solid is BuzzFeed's CSS style guide. Influenced by frameworks like Basscss, Solid uses immutable, atomic CSS classes to rapidly prototype and develop features, providing consistent styling options along with the flexibility to create new layouts and designs without the need to write additional CSS. *BuzzFeed*

Design Systems
Free

Style Guides

Real life pattern libraries, code standards documents and content style guides.

Design Systems
Free

Uber

These guidelines cover 9 elements: logo, color, composition, iconography, illustration, motion, photography, tone of voice, and typography.

Design Systems
Free

Cookbook

The styleguide is a resource for designers, product managers, and developers, providing a common language around Yelp’s UI patterns. *Yelp*

Design Systems