Primer, Vercel, Radix Primitives, Polaris & Mantine are my favorite. Brand Site Design has a nice list. Utopia is nice guideline for responsive design. Reshaped is great too.
- Tailwind UI - Beautiful UI components, crafted by the creators of Tailwind CSS. (HN) (HN 2)
- Mantine UI - Set of more than 120 responsive components built with Mantine. (Code) (Reddit)
- Radix - Design System and Component Library for Modulz. (Code) (Radix Primitives Cheat Sheet) (Primitives Cheat Sheet Code)
- GOV.UK - Design your service using GOV.UK styles, components and patterns. (Article) (HN) (GOV.UK in React)
- Chakra UI - Simple, Modular & Accessible UI Components for your React Applications. (HN) (Docs) (Web) (The road to Chakra 1.0 and all about Chakra UI) (Awesome Chakra UI) (Chakra UI For Beginners)
- Basis (Code)
- Styled system - Style props for rapid UI development.
- Base Web - React Component library implementing the Base design language. (Code) (Figma)
- Grommet - React-based framework that provides accessibility, modularity, responsiveness, and theming in a tidy package.
- smooth UI - Modern React UI library.
- Orbit - Open source design system for your next travel project. (Beta) (Code)
- Reach UI - Accessible Foundation for React Apps and Design Systems. (Docs)
- Latitude - Design guidelines, component documentation, styling instructions, and resources for building interfaces with Flexport’s design system. (HN) (Code)
- Vercel (Code)
- Primer - Design, build, and create with GitHub’s design system. (Team) (Code) (Links) (Web Code)
- Primer Brand - React components for GitHub marketing websites.
- Fannypack - Friendly, themeable, accessible React UI Kit built with Reakit.
- Braid - Themeable design system for the SEEK Group.
- Lunar - React toolkit and design language for Airbnb open source and internal projects.
- Welcome UI
- Ring UI - JetBrains Web UI components. (Code)
- Classy-UI - Atomic design system inspired by the wonderful Tailwindcss. (Code)
- Radix UI - Open-source UI component library for building high-quality, accessible design systems and web apps. (Code) (Docs Code)
- Carbon - Design system built by IBM. (Web)
- React Zeit Design
- Fluent UI React - Set of React components for building Microsoft web experiences. (Figma) (Web)
- Operational UI Components - Contains simple, stateless UI building blocks - your typical input fields, buttons, cards, grids, and so on.
- react-ui - Customisable components and primitives based on design tokens.
- Spectrum - Adobe’s design system. (Code) (Version 3) (HN) (React Spectrum Libraries) (Docs)
- React Aria - Library of React Hooks that provides accessible UI primitives for your design system. (HN)
- Stacks - Stack Overflow’s Design System. (Code)
- Elastic UI framework - Design library in use at Elastic to build internal products. (Code)
- Radius - Design System Accelerator. (Code)
- 98.css - Design system for building faithful recreations of old UIs. (Code) (HN)
- Circuit UI - Design system & component library for SumUp web apps. (Code)
- Palette - Artsy's design system. (Code)
- Guardian Source (Code)
- VKUI - VK design system.
- Theme UI Sketchy Preset
- UIkit - Lightweight and modular front-end framework for developing fast and powerful web interfaces.
- Docker Design System
- SHAPER - Interface styles shaper. (Code) (Tweet)
- FAST - Adaptive interface system for modern web experiences. (Docs) (HN)
- Material Design (Code)
- Atlassian Design System
- UI Playbook - Documented collection of UI components. (Code)
- Dracula UI - Dark-first collection of UI patterns and components.
- @polkadot/ui (Web)
- Dripsy - Responsive, theme-based design system for Expo + React Native Web.
- Storybook Design System - Codifies existing UI components into a central, well-maintained repository.
- Geist - Modern and minimalist React UI library, originating from Vercel's design. (Docs)
- Arcade Design - React components you need in all your projects to focus on solving the problems and launch faster.
- ui-neumorphism - React component library designed on the "new skeuomorphism" or "neumorphism" UI/UX trend.
- Forma 36 - Contentful Design System. (Code)
- Blueprint - React-based UI toolkit for the web. (Code)
- Qui - Vue.js design-system for Web.
- React Suite - Suite of React components, sensible UI design, and a friendly development experience. (Code)
- Ant Design - World's second most popular React UI framework. (Code)
- aragonUI - UI kit for decentralized apps. (Code)
- Salesforce Lightning Design System (Code)
- Shopify Polaris design tokens
- Material You - Next stage for Material Design. (HN)
- Gestalt - Set of React UI components that enforces Pinterest’s design language. (Web)
- Woly UI Dev Kit - Modular design-system to build flexible UI.
- Helsinki Design System
- Prisma Lens - Design System, Guidelines and Component Library for the family of Prisma projects and products. (Web)
- AWS UI Components
- Amsterdam Styled Components (ASC) - Component Library based on Amsterdam Design System.
- Paste - Design System for building Twilio customer experiences. (Code)
- Atomize Code - UI Design System for React JS. (Web)
- doc-blocks - Design system for doc-blocks UI components, built on @design-systems/cli.
- NativeBase - Mobile-first, accessible component library for building a consistent design system across android, iOS & web. (Web) (Docs) (Docs Code)
- Plasma UI - Позволяет реализовать Canvas App как часть экосистемы виртуальных ассистентов семейства "Салют". (Code)
- Apache Superset UI packages
- Mirror Design - Design system for Mirror.xyz built with React and vanilla-extract. (Code)
- Arco Design React
- Equinor Design System
- Style Guide of republik.ch - Exporting React components for typography, forms and various article elements. (Code)
- Orbit - Design system for ShareGate.
- Talend - Design system used to build accessible, consistent, customizable and high quality customer experiences at Talend. (Code)
- Moai UI Kit - React Component Library, Where Buttons Look Like Buttons. (Code)
- Tamagui - React Native + Web UI kit. (Code)
- Brix UI - Library of reusable UI components for React, made in minimalistic and light style.
- Marigold Design System - Design System based on emotion, react-aria & theme-ui. (Code)
- UI Kit Component library
- California Design System
- RevKit - Design System UI Kit. (Solid Code)
- Workday Canvas Kit
- AgnosticUI - UI primitives that start their lives in clean HTML and CSS. (Code)
- MUI X - Performant advanced components. (Code)
- Inkline - Paper - Unified interface for defining components for Vue and React using a single code base.
- USWDS: The United States Web Design System (HN)
- Mdash - Design system that fully embraces web standards. (Code)
- PIXIV Design System
- Europa Component Library (Code)
- Kaizen Design System (Code)
- Backpack - Skyscanner's Design System. (iOS Code) (Code)
- Horizon UI - Open Source Admin Template for Chakra UI & React.
- AriaKit - Toolkit for building accessible web apps with React. (Twitter)
- ENS Design System - Design system for ENS built with React and styled-components.
- NeoPOP - CRED's inbuilt library for using NeoPOP components in your web app.
- Baklava - Design system provided by Trendyol to create a consistent UI/UX for app users.
- Cloudscape (React Code)
- System.css - Design system for building retro Apple-inspired interfaces. (HN)
- JetBrains Ring UI (HN)
- If you have 10 teams working independently, you're already maintaining 10 design systems—or even more. It's cheaper to do it once.
- Making design system decisions in order to be tech agnostic is actually doing a disservice. Usually the tradeoff becomes less ability to codify the decisions into the system, way more process and effort to evolve and educate, ultimately more expensive.
- If you're not a designer the easiest way to make your site look pro is to keep your Artist palette color palette VERY limited. Most sites have only: 1. brand color (red, blue, green, orange, purple). 2. main color (black). 3. secondary color (gray).
- Playroom - Design with JSX, powered by your own component library.
- Awesome React Design Systems - Curated list of design systems made up of reusable React components.
- Framer Session 6 — Framer Bridge
- Introducing Base Web, Uber’s New Design System for Building Websites in React (2019)
- Stencil - Web Component compiler for building fast, reusable UI components and Progressive Web Apps. (Web) (Web Code)
- Theme UI - Build consistent, themeable React UIs based on design system constraints and design tokens.
- Awesome component-driven development
- Modulz - Design, develop, document and deploy your design system—without writing code.
- Design System Playground - Play with typography and colors to generate a design system theme you can use in your projects.
- Curated list of design systems
- ReactiveConf 2019 - Mark Dalgleish: Rethinking Design Practices
- Emma Wedekind: Foundations of Design Systems (2019)
- Design Systems Slack
- Awesome Design Systems
- Zeroheight - Create beautiful living styleguides and document all your design system resources in one place.
- Laying the Foundations - Book about design systems.
- Designing with React - Mark Dalgleish (2019)
- Design Systems Design System - Siddharth Kshetrapal (2019)
- Karri Saarinen - Scaling design with systems (2017)
- Design System Checklist - Open-source checklist to help you plan, build and grow your design system. (Code)
- OpenChakra - Visual editor for Chakra UI. (Code) (HN)
- Chromatic - Tool to help manage design systems by generating platform-specific files from a source file describing design tokens.
- Prism - Gett's Design System code generator. Use Zeplin Styleguides as your R&D's Single Source of Truth.
- System UI Theme Specification
- CSS Analytics for Design Systems - Analyze your CSS and keep track of changes in complexity and branding..
- Diez - Design Token Framework. (Code)
- Learn Storybook - Learn to develop UIs with components and design systems. (Code)
- Style Dictionary - Build system for creating cross-platform styles.
- Style Guide Guide - For creating superb style guides. (Code)
- The design systems between us (2020)
- Reimagining Design Systems at Spotify (2019)
- Radius Design Kit - Figma - Collection of open-source tools and libraries that allow you to accelerate your own design system.
- Awesome Design Systems Jobs
- Design System Kit - Workbench for collaboratively creating Design Systems. (Web)
- Tips on making good design systems (2020)
- Naming Tokens in Design Systems. Terms, Types, and Taxonomy to Describe (2020)
- storybook-addon-designs - Storybook addon that embed Figma, websites, PDF or images in the addon panel.
- UI Guideline - Component Standardization - Definitive guide to standardize the design/code of UI Components.
- Design Systems Figma (2020)
- Introduction to Design Systems for UX/UI Designers (2020)
- Design Systems Benchmark
- Storybook Playroom Addon - Design with Playroom inside Storybook, using each story source as a starting point.
- React Component Library - Project skeleton to get your very own React Component Library up and running using Rollup, Typescript, SASS + Storybook.
- Design Systems Are Bullsh*t (2020)
- Where to start with design tokens (2020)
- Design Systems Checklist
- Creating a Style System (2020)
- Hawkins: Diving into the Reasoning Behind our Design System (2021)
- Design System Questionnaire
- Component Gallery - Collection of interface components from real-world design systems. (Code)
- Design Systems 101
- Specify - One Design API, for all your design system tools. (Specify Parsers)
- Why I Build Design Systems with Stitches and Radix (2021) (Tweet)
- Microsoft Inclusive Design
- Storybook Deployer - Deploy your storybook as a static site.
- Programming Design Systems Book (Code)
- Design Systems List - List of famous design systems, design languages and guidelines.
- Designs Systems CLI - CLI toolbox for creating design systems. (Docs)
- Wedges - Super-simple way to build beautiful websites. Pre-built, customizable, stackable, UI components. (Twitter)
- A Design System Governance Process (2021)
- A Content Model Is Not a Design System (2021)
- Dessert Box - Library to easily consume your design tokens from a React component, meant to be used with vanilla-extract.
- Variant-driven Components (2021)
- Design systems and magic (2021)
- Design Systems are for user interfaces (2021)
- Design Systems London Online #1 (2021)
- Design-Systems-Resources
- HyperTheme Editor - Most advanced visual theme editor for Chakra-UI. (Code)
- Documenting Design Systems In NextJS
- Design Systems Demystified
- The Practical Guide to Naming Design Tokens (2022)
- Specify - Design Data Platform. (Twitter)
- Storybook Design Token Addon
- Brand Site Design - Collection of purpose-built, digital, accessible guidelines from global brands.
- Fluid Design Systems With Netlify On-demand Builders
- Multi-platform design system at Booking.com – Figma (2022)
- Design System in 90 Days
- Cobalt - Turns your design tokens into code. (Code)
- Awesome design language system
- Why most design systems implode (2022)
- Shopify Design Foundations - Prototype for a foundational design system at Shopify.
- Design Tokens Technical Reports (Code)
- Advanced Design Systems
- Naming conventions for design systems (2022)
- How to build a universal design system (2021)
- Design System Pipelines demo - Demo for E2E build piplelines in Design Systems using monorepo's and automation.
- Reshaped - Design system built for your scale with React and Figma. (Twitter)
- Design system tips