design-systems

Open-source projects categorized as design-systems

Top 23 design-system Open-Source Projects

  • Material UI

    Ready-to-use foundational React components, free forever. It includes Material UI, which implements Google's Material Design.

    Project mention: Zero-runtime CSS-in-JS implementation | news.ycombinator.com | 2024-01-29
  • antd

    An enterprise-class UI design language and React UI library

    Project mention: React Component Libraries | dev.to | 2024-03-13

    Official Website: https://ant.design/

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  • storybook

    Storybook is a frontend workshop for building UI components and pages in isolation. Made for UI development, testing, and documentation.

    Project mention: Announcing AnalogJS 1.0 🚀 | dev.to | 2024-03-14

    We are continuing to make building fullstack websites and application with Analog and Angular as seamless as possible, and extending the Angular ecosystem through integrations with Astro, Nx, [Vitest]https://analogjs.org/docs/features/testing/vitest, Storybook, and more.

  • Awesome-Design-Tools

    The best design tools and plugins for everything 👉

    Project mention: Suggestions for new Awesome Design Tools | /r/DigitalArt | 2023-04-12

    I'm a big fan of curated lists and resources, and a great example of that is GitHub's awesome lists but I've noticed there seems to be a lack of any art focused that isn't specific to one software (such as Awesome Blender) or that are actively maintained, the closest being https://github.com/goabstract/Awesome-Design-Tools, which, although still quite helpful today, hasn't been updated in 3 or 4 years since Flawless Apps joined the Abstract team, so contains many broken links and there are plenty of new and useful options that aren't there. So I'm going to remake it over the next weekend and keep it regularly updated so any help with finding links to software, plugins, hardware, websites, learning materials and anything else you think might be relevant, any help would be greatly appreciated.

  • daisyui

    🌼 🌼 🌼 🌼 🌼  The most popular, free and open-source Tailwind CSS component library

    Project mention: Building a Fast, Efficient Web App: The Technology Stack of PromptSmithy Explained | dev.to | 2024-03-26

    While I have experience with Tailwind and frontend development, I don’t really have the patience to use it. I usually end up using something like Mantine, which is a complete component library UI kit, or Daisy UI, which is a component library built on top of Tailwind. Shadcn/ui is quite similar to Daisy in this sense, but being able to customize the individual components, since they get installed to your components folder, made development more streamlined and more customizable. On top of that being able to change my components style with natural language thanks to v0 made development super easy and fast. Shadcn may be too minimalist of a style for some, but thanks to all the components being local, you can customize them quickly and easily!

  • iview

    A high quality UI Toolkit built on Vue.js 2.0

  • system-design-interview

    System design interview for IT companies

    Project mention: Advice on Learning the Cloud | /r/devopsjobs | 2023-04-17

    github - https://github.com/donnemartin/system-design-primer, https://github.com/checkcheckzz/system-design-interview, https://github.com/karanpratapsingh/system-design

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

  • awesome-design-systems

    💅🏻 ⚒ A collection of awesome design systems

  • primitives

    Radix Primitives is an open-source UI component library for building high-quality, accessible design systems and web apps. Maintained by @workos.

    Project mention: Radix Primitives: an open-source UI component library | news.ycombinator.com | 2024-03-20
  • TW-Elements

    𝙃𝙪𝙜𝙚 collection of Tailwind components, sections and templates 😎

    Project mention: 500 open-source components for TailwindCSS | dev.to | 2023-10-30

    I'd like to share my latest discovery with you. TW Elements is currently, the most popular 3rd party UI kit for TailwindCSS with over 10k Github stars. It's a huge collection of stunning components made with attention to the smallest detail. Forms, cards, buttons, and hundreds of others. All components have dark mode and very intuitive theming options. The project is supported by an engaged community on GitHub, I recommend you check it out and join one of the many discussions. You will find installation instructions here, and you can track the progress of the project live here. The project was kickstarted by @mdbootstrap, a group of open-source developers behind MDB UI Kit - a high-quality UI kit for Bootstrap, and also behind MDB GO - hosting and deployment platform. I highly recommend you to check it out!

  • Primer

    The CSS design system that powers GitHub

    Project mention: Tremor – The React library to build dashboards fast | news.ycombinator.com | 2023-07-28

    If you are looking for a dashboard system that is written in vanilla JS, I will be open sourcing my DevBoard in the next month or two. You can see it in action at https://devboard.gitsense.com/microsoft/vscode and learn more about the widget system at https://devboard.gitsense.com/microsoft/vscode?board=gitsens... Note the repo that is mentioned in the intro page hasn't been pushed to GitHub yet, but will be soon.

    The server is a very simple node/express app and the front end is written in vanilla javascript. I also use GitHub's primer css (https://github.com/primer/css) and a heavily stripped down version of tabler's css (https://github.com/tabler/tabler)

    Note, DevBoard is more geared towards hackers, so Tremor's is probably a much better fit if you are looking for an out of the box solution.

  • evergreen

    🌲 Evergreen React UI Framework by Segment

    Project mention: ⚡Top GitHub Repositories for UI Components | dev.to | 2024-01-05

    🔍 Site ⭐ GitHub

  • tachyons

    Functional css for humans

    Project mention: Kicking the tires with NestJS and Hotwire: Part II | dev.to | 2023-11-15

    I chose Tachyons over Tailwind because Tachyons is an atomic CSS framework, similar to Tailwind, however it's much lighter weight. Tailwind tends to be a bit heavier without using post CSS processing so I wanted to stick with something smaller.

  • react-spectrum

    A collection of libraries and tools that help you build adaptive, accessible, and robust user experiences.

    Project mention: Accessibility and Headless UI Libraries - Adobe, Radix, Tailwind, MUI | dev.to | 2023-09-24

    Adobe - React ARIA

  • modular-monolith-with-ddd

    Full Modular Monolith application with Domain-Driven Design approach.

    Project mention: Modular Monolith with DDD repository migrated to .NET 8.0 | /r/dotnet | 2023-12-09

    Link to PR here: https://github.com/kgrzybek/modular-monolith-with-ddd/pull/286

  • fast

    The adaptive interface system for modern web experiences.

    Project mention: A love letter to Apache Echarts | news.ycombinator.com | 2024-02-18

    If you are generally interested in how to write components that can be used by many frontend libraries (react/vue, etc), you should take a look at https://github.com/microsoft/fast. I was tangentially involved with porting an existing component library to it and the end result was pretty framework agnostic and well made.

  • base web

    A React Component library implementing the Base design language

    Project mention: ⚡Top GitHub Repositories for UI Components | dev.to | 2024-01-05

    🔍 Site ⭐ GitHub

  • styled-system

    ⬢ Style props for rapid UI development

    Project mention: An Overview of 25+ UI Component Libraries in 2023 | dev.to | 2023-09-10

    KumaUI : Another relatively new contender, Kuma uses zero runtime CSS-in-JS to create headless UI components which allows a lot of flexibility. It was heavily inspired by other zero runtime CSS-in-JS solutions such as PandaCSS, Vanilla Extract, and Linaria, as well as by Styled System, ChakraUI, and Native Base. ### Vue

  • uswds

    The U.S. Web Design System helps the federal government build fast, accessible, mobile-friendly websites.

    Project mention: Firefox on the brink? | /r/webdev | 2023-12-06

    Now and then I stumble upon the USWDS (the article mentions it) and am surprised how good that thing actually is.

  • polaris

    Shopify’s design system to help us work together to build a great experience for all of our merchants.

    Project mention: What's new in Ryviu's latest interface | /r/ryviu | 2023-12-10

    We are delighted to announce that the interface of Ryviu account has been updated according to Shopify Polaris. Aligned with Shopify's top-tier standards for safety, performance, and functionality, these changes aim to simplify the process of importing and managing product reviews for your store.

  • playroom

    Design with JSX, powered by your own component library.

  • zeit-ui-react

    A design system for building modern websites and applications.

  • plasmic

    Visual builder for React. Build apps, websites, and content. Integrate with your codebase.

    Project mention: A list of SaaS, PaaS and IaaS offerings that have free tiers of interest to devops and infradev | dev.to | 2024-02-05

    Plasmic - A fast, easy-to-use, robust web design tool and page builder that integrates into your codebase. Build responsive pages or complex components; optionally extend with code; and publish to production sites and apps.

  • WorkOS

    The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.

NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2024-03-26.

design-systems related posts

Index

What are some of the best open-source design-system projects? This list will help you:

Project Stars
1 Material UI 91,272
2 antd 89,794
3 storybook 82,506
4 Awesome-Design-Tools 31,504
5 daisyui 29,945
6 iview 23,971
7 system-design-interview 20,945
8 awesome-design-systems 16,577
9 primitives 13,863
10 TW-Elements 12,594
11 Primer 12,427
12 evergreen 12,294
13 tachyons 11,563
14 react-spectrum 11,439
15 modular-monolith-with-ddd 10,134
16 fast 8,971
17 base web 8,594
18 styled-system 7,802
19 uswds 6,609
20 polaris 5,615
21 playroom 4,408
22 zeit-ui-react 4,181
23 plasmic 3,926
The modern identity platform for B2B SaaS
The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.
workos.com