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. Learn more โ
Top 23 Material Design Open-Source Projects
-
-
Material UI
Ready-to-use foundational React components, free forever. It includes Material UI, which implements Google's Material 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.
-
awesome-flutter
An awesome list that curates the best Flutter libraries, tools, tutorials, articles and more.
-
Ionic Framework
A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
-
-
-
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.
-
-
-
-
-
-
-
-
-
-
TW-Elements
๐๐ช๐๐ collection of Tailwind MIT licensed (free) components, sections and templates ๐
-
-
-
bootstrap-table
An extended table to integration with some of the most widely used CSS frameworks. (Supports Bootstrap, Semantic UI, Bulma, Material Design, Foundation, Vue.js)
-
MaterialDrawer
The flexible, easy to use, all in one drawer library for your Android project. Now brand new with material 2 design.
-
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.
[3]: https://github.com/flutter/flutter/tree/master/packages/flut...
Project mention: In-Depth Perspective on Flutter: A Comprehensive Analysis and Practice Guide | dev.to | 2024-02-08Website: https://github.com/Solido/awesome-flutter
I was recently able to sit down with some of the core members of Ionic, who also created Stencil a toolchain for building Design Systems and Progressive Web Apps. We talked at great length how typically companies are approaching Ionic from a Design Team and need help building components. As a developer I wanted to talk about the Web Components that are used within the Design System first. There was a decent amount of surprise, so I thought I would break down what a Design System is and why it doesn't matter which end you start with, as long as you have both your Design and Development teams working together to build your Design System.
They link on the docs to the github which lists these extra options though. https://github.com/google/material-design-icons/tree/master/font So it's easy to miss.
๐ https://vuetifyjs.com
Project mention: Front-end Framework: Comparing Bootstrap, Foundation and Materialize | dev.to | 2024-04-16Materialize was created by a team of developers at Google, inspired by the principles of Material Design. Material Design is a design language developed by Google that emphasizes tactile surfaces, realistic lighting, and bold, graphic interfaces. Materialize aims to bring these principles to web development by providing a framework with ready-to-use components and styles based on Material Design.
What does this bring that the Quasar framework doesnโt already? This sure looks like an ad for a barely preconfigured quasar templateโbut itโs impossible to tell.
https://quasar.dev/
๐ https://material.angular.io
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!
Project mention: Created this app using Swift and a bit of Objective-C | /r/iOSProgramming | 2023-04-30I started out with the Hero library (https://github.com/HeroTransitions/Hero) but soon replaced it with custom made animation. However, you may want to look into this library as is has a lot of nice transitions ready to use for most cases.
Material Mk-Docs by Martin Donath works well if you prefer python.
Some frameworks and themes to use in combination :
- https://konstaui.com/
- https://framework7.io/
https://github.com/firebase/firebase-ios-sdk/issues/6115
https://github.com/material-components/material-components-w...
Two examples that come to mind but there are plenty
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!
Project mention: Senior devs โ how do you handle styles; and how do you scale it | /r/reactnative | 2023-10-12In most cases they are wrappers around pure RN components (as I have been burnt by styling lib in the past - exactly NativeBase and its performance issues) and in the end, created components look like very light-weight version of RN paper components*:* https://github.com/callstack/react-native-paper/blob/main/src/components/Typography/Text.tsx.
Project mention: blazor with bootstrap and what is different bootstrap-table. | /r/Blazor | 2023-06-06but...I don't know what is different Bootstrap 5.x.x inside table and bootstrap-table(https://bootstrap-table.com/).
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).
Material Design related posts
- GreenStash: Simple FOSS Android app to plan and manage your savings goals easily
- Button Component with RiotJS (Material Design)
- Android 12+: Changing wallpaper or dark theme breaks Flutter and Jetpack Apps
- Android 12: Changing wallpaper or dark theme breaks Flutter and Jetpack Compose
- Input Component with RiotJS (Material Design)
- RiotJS Material Design (how to setup BeerCSS)๐ป
- KeePassXC 2.7.7 with Passkeys
-
A note from our sponsor - SurveyJS
surveyjs.io | 24 Apr 2024
Index
What are some of the best open-source Material Design projects? This list will help you:
| Project | Stars | |
|---|---|---|
| 1 | Flutter | 161,649 |
| 2 | Material UI | 91,511 |
| 3 | awesome-flutter | 51,230 |
| 4 | Ionic Framework | 50,386 |
| 5 | material-design-icons | 49,750 |
| 6 | vuetify | 39,024 |
| 7 | Materialize | 38,860 |
| 8 | material-design-lite | 32,282 |
| 9 | Quasar Framework | 25,202 |
| 10 | components | 24,072 |
| 11 | mdb-ui-kit | 24,004 |
| 12 | Hero | 21,802 |
| 13 | FlutterExampleApps | 19,945 |
| 14 | mkdocs-material | 18,198 |
| 15 | framework7 | 17,843 |
| 16 | Material Components Web | 17,075 |
| 17 | material-components-android | 15,946 |
| 18 | MaterialDesignInXamlToolkit | 14,616 |
| 19 | TW-Elements | 12,643 |
| 20 | react-native-paper | 12,193 |
| 21 | Material | 11,968 |
| 22 | bootstrap-table | 11,666 |
| 23 | MaterialDrawer | 11,658 |
Sponsored
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