# awesome-design-systems **Repository Path**: stlstl/awesome-design-systems ## Basic Information - **Project Name**: awesome-design-systems - **Description**: πŸ’…πŸ» βš’ A collection of awesome design systems - **Primary Language**: Unknown - **License**: Unlicense - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2020-10-17 - **Last Updated**: 2021-01-11 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README ![cover](/cover.png) ![Contributions Welcome](https://img.shields.io/badge/Contributions-welcome-blue.svg) Know a resource that isn't listed below? Feel free to create a new [pull request](https://github.com/alexpate/awesome-design-systems/pulls). > A design system is a collection of documentation on principles and best practices, that helps guide a team to build digital products. They are often embodied in UI libraries and pattern libraries, but can extend to include guides on other areas such as 'Voice and Tone'. --- ### Tags - Components: Contains coded patterns and examples. - Voice & Tone: Provides guidance on how language should be used. - Designers Kit: Includes a Sketch/Photoshop/Figma/etc. file for designers. - Source code: Publically viewable source code --- | | Components | Voice & Tone | Designers Kit | Source code \* | | --------------------------------------------------------------------------------- | :--------: | :----------: | :-----------: | :--------------------------------------------------------------------------------: | | [Adobe Spectrum](https://spectrum.adobe.com) | | πŸ‘ | πŸ‘ | | | [Alfa-Bank](https://design.alfabank.ru) | πŸ‘ | | πŸ‘ | [:octocat:](https://github.com/alfa-laboratory/arui-feather) | | [Alibaba Ant Design](https://ant.design) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/ant-design/ant-design/) | | [Appear Here Styleguide](https://bloom.appearhere.co.uk/) | πŸ‘ | | | [:octocat:](https://github.com/appearhere/bloom) | | [Apple Developer Design Guidelines](https://developer.apple.com/design/) | | | πŸ‘ | | | [Aragon UI](https://ui.aragon.org/) | πŸ‘ | | | [:octocat:](https://github.com/aragon/aragon-ui) | | [Artsy Palette](https://palette.artsy.net/) | πŸ‘ | | | [:octocat:](https://github.com/artsy/palette) | | [AT UIKIT](https://at-ui.github.io/at-ui/#/en) | πŸ‘ | | | [:octocat:](https://github.com/at-ui/at-ui) | | [Atlassian Design Guidelines](https://atlassian.design) | πŸ‘ | πŸ‘ | πŸ‘ | [:space_invader:](https://bitbucket.org/atlassian/atlaskit-mk-2/src/master/) | | [Audi UI Kit](https://www.audi.com/ci/en/guides/user-interface/introduction.html) | πŸ‘ | | πŸ‘ | [:octocat:](https://github.com/audi/audi-ui) | | [Aurora (Government of Canada)](https://design.gccollab.ca/) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/gctools-outilsgc/design-system) | | [Australian Government Design System](https://designsystem.gov.au/) | πŸ‘ | | | [:octocat:](https://github.com/govau/design-system-components/) | | [AutoGuru Overdrive](http://overdrive.autoguru.io/) | πŸ‘ | | | [:octocat:](https://github.com/autoguru-au/overdrive) | | [Backpack (Skyscanner)](https://skyscanner.design/) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/skyscanner/backpack) | | [Barnardo’s Design System](https://design-system.barnardos.org.uk) | πŸ‘ | πŸ‘ | | [:octocat:](https://github.com/barnardos/design-system) | | [BBC GEL (Global Experience Language)](https://www.bbc.co.uk/gel) | πŸ‘ | πŸ‘ | πŸ‘ | | | [BLiP](https://design.blip.ai/) | πŸ‘ | | | [:octocat:](https://github.com/takenet/blip-toolkit) | | [Bold (Bridge Design System)](https://bold.bridge.ufsc.br/) | πŸ‘ | | πŸ‘ | [:octocat:](https://github.com/laboratoriobridge/bold) | | [Blueprint](https://blueprintjs.com/) | πŸ‘ | | πŸ‘ | [:octocat:](https://github.com/palantir/blueprint) | | [Bulb Design System](https://design.bulb.co.uk/) | πŸ‘ | πŸ‘ | | | | [BuzzFeed Solid](https://solid.buzzfeed.com/) | πŸ‘ | | πŸ‘ | [:octocat:](https://github.com/buzzfeed/solid) | | [eBay Skin](https://ebay.github.io/skin/) | πŸ‘ | | | [:octocat:](https://github.com/eBay/skin) | | [Enigma Boundless](https://boundless.js.org/) | πŸ‘ | | | [:octocat:](https://github.com/enigma-io/boundless) | | [CA Technologies Mineral UI](https://mineral-ui.com/) | πŸ‘ | | | [:octocat:](https://github.com/mineral-ui/mineral-ui) | | [Cards Binary Design](https://github.com/opensource-cards/binary-ui) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/opensource-cards/binary-ui) | | [CBRE Blocks](https://blocks.cbrebuild.com/) | πŸ‘ | πŸ‘ | | | | [Cedar](https://rei.github.io/rei-cedar-docs/) | πŸ‘ | | πŸ‘ | [:octocat:](https://github.com/rei/rei-cedar) | | [Chakra UI](https://chakra-ui.com/) | πŸ‘ | | | [:octocat:](https://github.com/chakra-ui/chakra-ui/tree/master/packages/chakra-ui) | | [Cloudflare](https://cloudflare.github.io/cf-ui/) | πŸ‘ | | | [:octocat:](https://github.com/cloudflare/cf-ui) | | [City of Boston Fleet](https://github.com/CityOfBoston/digital/wiki/Fleet) | πŸ‘ | πŸ‘ | | [:octocat:](https://github.com/CityOfBoston/digital) | | [Co-op Design Manual](https://coop-design-manual.herokuapp.com/) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/coopdigital/design-system) | | [Contentful Forma 36](https://f36.contentful.com/) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/contentful/forma-36) | | [ENGIE Fluid Design System](https://www.engie.design) | πŸ‘ | | πŸ‘ | | | [Estonia Country Design Guidelines](https://brand.estonia.ee) | πŸ‘ | πŸ‘ | πŸ‘ | | | [Elastic UI Framework](https://elastic.github.io/eui/) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/elastic/eui) | | [Evergreen](https://evergreen.surge.sh) | πŸ‘ | | | [:octocat:](https://github.com/segmentio/evergreen) | | [Figma UI Components](https://figma-ui.lessmess.dev/) | πŸ‘ | | | [:octocat:](https://github.com/lessmess-dev/figma-ui-components) | | [Financial Times Origami](https://origami.ft.com/) | πŸ‘ | | | [:octocat:](https://github.com/Financial-Times/origami) | | [Firefox Photon Design System](https://design.firefox.com/photon) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/FirefoxUX/photon) | | [Foyer Design System](https://design.foyer.lu/) | πŸ‘ | | πŸ‘ | :closed_lock_with_key: | | [FutureLearn Pattern Library](https://www.futurelearn.com/pattern-library) | πŸ‘ | | | | | [GitHub Primer](https://primer.style/) | πŸ‘ | | πŸ‘ | [:octocat:](https://github.com/primer/) | | [GitLab Design System - Pajamas](https://design.gitlab.com/) | πŸ‘ | πŸ‘ | πŸ‘ | [:fox_face:](https://gitlab.com/gitlab-org/design.gitlab.com) | | [Google Material Design](https://material.io/guidelines/#introduction-goals) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/material-components/material-components) | | [GOV.UK Design System](https://www.gov.uk/design-system) | πŸ‘ | | | [:octocat:](https://github.com/alphagov/govuk-design-system) | | [Help Scout](https://style.helpscout.com/) | πŸ‘ | πŸ‘ | | [:octocat:](https://github.com/helpscout/seed-framework) | | [Heroku Purple3](https://design.herokai.com/) | πŸ‘ | | | | | [Hewlett Packard grommet](https://grommet.github.io) | πŸ‘ | | | [:octocat:](https://github.com/grommet/grommet) | | [HubSpot Canvas](https://canvas.hubspot.com/) | πŸ‘ | πŸ‘ | | [:octocat:](https://github.com/HubSpot/canvas) | | [Hudl Design System](https://uniform.hudl.com/) | πŸ‘ | πŸ‘ | | | | [IBM Carbon](https://www.carbondesignsystem.com/) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/ibm/carbon-components) | | [IBM Design Language](https://www.ibm.com/design/language/) | πŸ‘ | πŸ‘ | | | | [IBM Northstar](https://www.ibm.com/standards/web/) | πŸ‘ | πŸ‘ | | | | [Intuit Harmony](https://designsystem.quickbooks.com/) | πŸ‘ | πŸ‘ | πŸ‘ | | | [JetBrains Ring UI](https://jetbrains.github.io/ring-ui) | πŸ‘ | | | [:octocat:](https://github.com/JetBrains/ring-ui) | | [Kalo UI](https://kalo.design) | πŸ‘ | | | [:octocat:](https://github.com/kalohq/ui) | | [Kiwi.com Orbit](https://orbit.kiwi) | πŸ‘ | | πŸ‘ | [:octocat:](https://github.com/kiwicom/orbit-components/) | | [Kontur](https://guides.kontur.ru/) | πŸ‘ | | πŸ‘ | [:octocat:](https://github.com/skbkontur/retail-ui/) | | [Lexicon](https://lexicondesign.io/) | πŸ‘ | πŸ‘ | | | | [Lonely Planet Rizzo](https://rizzo.lonelyplanet.com/) | πŸ‘ | | | [:octocat:](https://github.com/lonelyplanet/rizzo) | | [Louder Than Ten Manual](https://www.louderthanten.com/manual) | πŸ‘ | πŸ‘ | | | | [Lost My Name Design System](http://design-system.lostmy.name/) | πŸ‘ | | | | | [Mailchimp Content Styleguide](https://styleguide.mailchimp.com/) | | πŸ‘ | | | | [Mailchimp Patterns](https://ux.mailchimp.com/patterns) | πŸ‘ | | | | | [Marvel Styleguide](https://marvelapp.com/styleguide) | πŸ‘ | | | | | [Mesosphere CNVS](https://mesosphere.github.io/cnvs/) | πŸ‘ | | | [:octocat:](https://github.com/mesosphere/cnvs/) | | [Microsoft Fluent](https://www.microsoft.com/design/fluent/) | πŸ‘ | | πŸ‘ | | | [Mixpanel Design System](https://design.mixpanel.com) | πŸ‘ | πŸ‘ | | | | [MongoDB Design System](http://mongodb.design) | πŸ‘ | | πŸ‘ | [:octocat:](https://github.com/mongodb/design) | | [Monzo Tone of Voice](https://monzo.com/tone-of-voice/) | | πŸ‘ | | | | [Morningstar Design System](http://designsystem.morningstar.com/) | πŸ‘ | πŸ‘ | πŸ‘ | | | [NASA Web Design System](https://nasa.github.io/nasawds-site/) | πŸ‘ | | | [:octocat:](https://github.com/nasa/nasawds) | | [NationBuilder Radius](https://www.nationbuilder.design/) | πŸ‘ | | | | | [NHS.UK Service Manual (Beta)](https://beta.nhs.uk/service-manual/) | πŸ‘ | πŸ‘ | | | | [nib Health Funds](https://design.nib.com.au/) | πŸ‘ | | | | | [Nordnet](https://brand.nordnet.se/) | πŸ‘ | πŸ‘ | | | | [Nutanix Prism](https://nutanix.design/) | πŸ‘ | | | | | [Office UI Fabric](https://dev.office.com/fabric) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/OfficeDev/office-ui-fabric-react) | | [Opattern](https://ux.opower.com/opattern) | πŸ‘ | πŸ‘ | | | | [Oracle Alta UI](https://www.oracle.com/webfolder/ux/middleware/alta/index.html) | πŸ‘ | | | | | [Mail.ru Group Paradigm](https://design.mail.ru/) | πŸ‘ | πŸ‘ | πŸ‘ | | | [Pearson UX Framework](https://uxframework.pearson.com/) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/Pearson-Higher-Ed/design) | | [Pinterest Gestalt](https://pinterest.github.io/gestalt/#/) | πŸ‘ | | | [:octocat:](https://github.com/pinterest/gestalt) | | [Pivotal](https://styleguide.pivotal.io/) | πŸ‘ | | | [:octocat:](https://github.com/pivotal-cf/pivotal-ui) | | [Pluralsight Design System](https://design-system.pluralsight.com/) | πŸ‘ | | | [:octocat:](https://github.com/pluralsight/design-system) | | [Predix Design System](https://www.predix-ui.com/) | πŸ‘ | πŸ‘ | πŸ‘ | | | [Priceline Design System](https://pricelinelabs.github.io/design-system/) | πŸ‘ | πŸ‘ | | [:octocat:](https://github.com/pricelinelabs/design-system) | | [Pulse Design System](https://pulse.heartbeat.ua/) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/heartbeatua/Pulse-Boilerplate) | | [Pusher Chameleon](https://pusher.github.io/chameleon/) | πŸ‘ | | | [:octocat:](https://github.com/pusher/chameleon) | | [Rambler](https://rambler-digital-solutions.github.io/rambler-ui/) | πŸ‘ | | | [:octocat:](https://github.com/rambler-digital-solutions/rambler-ui) | | [Rendition](https://balena-io-modules.github.io/rendition/) | πŸ‘ | | | [:octocat:](https://github.com/balena-io-modules/rendition/) | | [Salesforce Lightning Design System](https://www.lightningdesignsystem.com) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/salesforce-ux/design-system) | | [SAP Fiori](https://experience.sap.com/fiori-design/) | πŸ‘ | | | | | [SAP Fundamental](https://github.com/SAP/fundamental) | πŸ‘ | | | [:octocat:](https://github.com/SAP/fundamental) | | [SAP OpenUI](https://github.com/SAP/openui5) | πŸ‘ | | | [:octocat:](https://github.com/SAP/openui5) | | [Seeds](https://sproutsocial.com/seeds) | πŸ‘ | πŸ‘ | πŸ‘ | | | [SEEK Style Guide](https://seek-oss.github.io/seek-style-guide/) | πŸ‘ | | | [:octocat:](https://github.com/seek-oss/seek-style-guide) | | [Shopify Polaris](https://polaris.shopify.com) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/Shopify/polaris) | | [Stacks – Stack Overflow](https://stackoverflow.design/) | πŸ‘ | πŸ‘ | | [:octocat:](https://github.com/StackExchange/Stacks) | | [Starbucks Style Guide](https://www.starbucks.com/static/reference/styleguide/) | πŸ‘ | | | | | [Sky Toolkit](https://www.sky.com/toolkit) | πŸ‘ | | | [:octocat:](https://github.com/sky-uk/toolkit) | | [The University of Melbourne Design System](https://web.unimelb.edu.au/) | πŸ‘ | | | [:octocat:](https://github.com/unimelb/unimelb-design-system) | | [Teambition Clarity Design](https://design.teambition.com/) | πŸ‘ | | | | | [Thumbprint](https://thumbprint.design/) | πŸ‘ | | | [:octocat:](https://github.com/thumbtack/thumbprint) | | [Uber's Base Web](https://baseweb.design/) | πŸ‘ | | | [:octocat:](https://github.com/uber-web/baseui) | | [USPTO UI Design Library](https://uspto.github.io/designpatterns/index.html) | πŸ‘ | | πŸ‘ | [:octocat:](https://github.com/uspto/designpatterns) | | [uSwitch style guide](https://ustyle.guide/) | πŸ‘ | πŸ‘ | | [:octocat:](https://github.com/uswitch/ustyle) | | [U.S. Web Design Standards](https://designsystem.digital.gov/) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/uswds/uswds) | | [U.S. CMS.gov Design System](https://design.cms.gov/) | πŸ‘ | | | | | [Vanilla framework](https://vanillaframework.io/) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/canonical-web-and-design/vanilla-framework) | | [VMware Clarity Design System](https://vmware.github.io/clarity/) | πŸ‘ | πŸ‘ | πŸ‘ | [:octocat:](https://github.com/vmware/clarity) | | [VTEX Styleguide](https://styleguide.vtex.com/) | πŸ‘ | | πŸ‘ | [:octocat:](https://github.com/vtex/styleguide) | | [WeWork Plasma](http://plasma.guide) | πŸ‘ | | | | | [Ray by WeWork](https://ray.wework.com) | πŸ‘ | | | [:octocat:](https://github.com/wework/ray) | | [Workday Canvas](https://design.workday.com/) | πŸ‘ | πŸ‘ | | [:octocat:](https://github.com/Workday/canvas-kit) | | [Yelp Styleguide](https://www.yelp.com/styleguide) | πŸ‘ | πŸ‘ | | | | [ZEIT](https://zeit.co/design) | πŸ‘ | | | | | [Zendesk Garden](https://garden.zendesk.com/) | πŸ‘ | | | [:octocat:](https://github.com/zendeskgarden) | ### Notes \*_Projects marked as open source may not always be open to use. Always check the license of these projects before using them._ Although 'design systems', 'ui libraries', and 'pattern libraries' are different things, they are often used interchangeably. This list contains all three. ### Credits Cover icon: 'Solar System' by Andrejs Kirma from the Noun Project