A curated list of awesome resources about digital design system.
Keywords: Design system, Design language framework, Design styleguide, Visual language, Vertical rhythm, Design grid system
- UI Components Handbook - The definitive guide to standardize the design/code of the UI Components based on the 39 most popular Reference Systems.
- Proportio - Tool for creating proportional scales for typography, iconography, spacing, and components in design systems.
- Atlassian Design Language
- BBC Gel
- Blackboard
- Carbon by IBM
- Code for America
- Cloudscape by Amazon - An open source design system for the cloud (GitHub)
- Disqus
- Dropbox
- Facebook Brand Resource Center
- FutureLearn
- Google Material Design
- Harmony
- HealthCare.gov
- IBM
- iOS Human Interface Guidelines (Apple)
- Mailchimp (email design guide)
- MailChimp Content Style Guide
- Microsoft Design
- mixpanel Design
- Nordnet
- OpenTable
- Photon Design System (Firefox)
- Shopify Polaris
- Uber
- Ubuntu
- Universal Windows Platform Guidelines (Microsoft)
- US Gov
- Wonderbly Design System
- [🇷🇺] Gov.design (Github) - Дизайн государственных систем России
- [🇷🇺] Дизайн Альфа-Банка (GitHub, Demo)
- [🇷🇺] Дизайн-система Иви
- [🇷🇺] Контур.Гайды
- [🇷🇺] Consta by Газпром нефть (Github, Figma)
- Ark UI - is a headless library for building reusable, scalable Design Systems that works for a wide range of JS frameworks. (GitHub)
React,Vue - AgnosticUI - Accessible React component primitives that also work with Vue 3, Svelte, and Angular! (GitHub, Demo)
- Alta UI by Oracle
- ANT DESIGN - A UI Design Language
- Atlas Kit (Atlassian) (React)
- Backpack UI: by Lonely Planet (GitHub, Demo)
- Bootstrap
- Brainly style guide (CSS)
- Carbon by IBM (React)
- Clarity Design System
- Co-op Design manual
- Coursera ui (React)
- Element (Vue 2)
- Ellucian
- Evergreen: by Segment (GitHub, Demo)
- Fabric: By Microsoft for MS Office (GitHub, Demo)
- Frosted UI: (GitHub)
- Grommet: bu Hewlett Packard (GitHub, Demo)
- Lightning Design System: by Salesforce (Demo, GitHub)
- MailChimp Pattern Library: by MailChimp
- Marvel by Marvel
- Material-UI (React)
- Mantine: React components library with native dark theme support (Demo, GitHub)
- Modulz Design System: An open–source design system of styles, components, templates, tools and documentation. (Demo, GitHub)
- Pajamas: by Gitlab (Source, Sketch)
- Pivotal
- Plasma design system: bu WeConnect (GitHub, Demo)
- [Medium: Plasma design system - Creating and documenting a product design system](https://medium.com/p/
- Predix UI (GitHub, Demo)
- Primer: by GitHub (GitHub, Demo)
- Ring UI (React) by JetBrains
- React Arial: by Adobe (GitHub, Demo) - Craft world-class accessible components with custom styles.
- Rizzo: by Lonely Planet (GitHub)
- RSUITE (GitHub, Demo)
- Semantic UI
- Solid: by Buzzfeed (GitHub)
- Storybook Design System: by Storybook (Demo, GitHub)
- UI Kit
- Yelp
- [🇷🇺] VKUI: by Vkontakte (GitHub) - android, ios ui kit
- Airbnb (article)
- How we’re using Component Based Design
- Creating a Design System Language…
- Plasma design system
- Building a Visual Language: Behind the scenes of our Airbnb design system
- Building a Visual Language
- A List of Style Guides, Brand Guidelines, and Front-End Frameworks
- 🇷🇺 4 правила работы в Sketch над крупными проектами
- Deep dive CSS: font metrics, line-height and vertical-align
- Align svg icons to text
- Design Systems Sprint 0: The Silver Bullet of Product Development.
- Design Systems Sprint 1: The Interface Inventory
- Design System Sprint 2: One Color Palette to Rule them All
- Design System Sprint 3: Managing the Basics
- Design System Sprint 4: Design Principles
- Design System Sprint 5: Managing Typography
- Design System Sprint 6: The Fastest Icons on Earth
- Building a design system for HealthCare.gov
- Create design system guid