Design Systems
A Design system is an organized set of interconnected patterns and shared practices.
Design systems aid in digital product design and development of products such as applications or websites.
They may contain, but are not limited to, pattern libraries, design languages, style guides, coded components, brand languages, and documentation.
- AirBnb: Behind the scenes of our new design system.
- Atlassian: Use Atlassian’s end-to-end design language to create simple, intuitive and beautiful experiences.
- Evergreen: Evergreen is a React UI Framework for building ambitious products on the web. Brought to you by Segment.
- 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
- 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
- Human Interface Guidelines: Get in-depth information and UI resources for designing great apps that integrate seamlessly with Apple platforms. Apple
- Lightning Design System: Salesforce Lightning Design System. Create the world’s best enterprise app experiences. Salesforce
- Mailchimp: Mailchimp Design System
- Material Design: Material is a design system – backed by open-source code – that helps teams build high-quality digital experiences. Google
- Polaris: Our design system helps us work together to build a great experience for all of Shopify’s merchants. Shopify
- 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
- 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
- Style Guides: Real life pattern libraries, code standards documents and content style guides.
- Uber: These guidelines cover 9 elements: logo, color, composition, iconography, illustration, motion, photography, tone of voice, and typography.
- Cookbook: The styleguide is a resource for designers, product managers, and developers, providing a common language around Yelp’s UI patterns.
ANT Design System
UI2: Figma's Design System
Base Gallery: Uber's Design System
