Example projects
A collection of example, boilerplates, and scaffolds to jumpstart your next Material UI project.
Official examples
The following starter projects are all available in the MUI Core /examples
folder.
These examples feature Material UI paired with other popular React libraries and frameworks, so you can skip the initial setup steps and jump straight into building.
Not sure which to pick? We recommend Next.js for a comprehensive solution, or Vite if you're looking for a leaner development experience. See Start a New React Project from the official React docs to learn more about the options available.
Next.js App Router
Vite.js
Next.js Pages Router
Remix
Tailwind CSS + CRA
Create React App
![styled-components](/static/images/examples/styled.png)
styled-components
Preact
![Express.js (server-rendered)](/static/images/examples/express.png)
Express.js (server-rendered)
Gatsby
React-admin
Official themes and templates
Once you've chosen your preferred scaffold above, you could move on to the Templates doc and choose a readymade user interface to plug in.
For more complex prebuilt UIs, check out our premium themes and templates in the MUI Store.
Community projects
The following projects are maintained by the community and curated by MUI. They're great resources for learning more about real-world usage of Material UI alongside other popular libraries and tools.
Free
GraphQL API and Relay Starter Kit:
- GraphQL API project using code-first design (TypeScript, OAuth, GraphQL.js, Knex, Cloud SQL).
- Web application project pre-configured with Webpack v5, TypeScript, React, Relay, Material UI.
- Serverless deployment:
api
-> Cloud Functions,web
-> Cloudflare Workers. - Client-side page routing/rendering at CDN edge locations, lazy loading.
- Optimized for fast CI/CD builds and deployments using Yarn v2 monorepo design.
-
- A frontend framework for building B2B applications running in the browser.
- On top of REST/GraphQL APIs, using ES6, React and Material Design.
-
- An open-source, headless, React-based framework for the rapid development of web applications that supports Vite, Next.js and Remix.
- Designed for building data-intensive applications like admin panels, dashboards, and internal tools, but thanks to built-in SSR support, can also power customer-facing applications like storefronts.
- Supports Material UI to generate a complete CRUD app that follows the Material Design guidelines and best practices.
- Connectors for 15+ backend services, including REST API, GraphQL, NestJS, Airtable, Strapi, Supabase, Appwrite, Firebase, and Hasura.
- Out-of-the-box support for live/real-time applications, audit logs, authentication, access control flows and i18n.
- Advanced routing with any router library.
-
- Created with Create React App.
- Custom Create React App script to start a new project with just a single CLI command.
- Build for Firebase including Authentication using the official Firebase Web Auth UI.
- Routing with React Router including error handling (404) and lazy loading.
- All PWA features included (SW, Notifications, deferred installation prompt, and more).
- Optimized and scalable performance (all ~100 points on Lighthouse).
-
- Created with Create React App.
- Features a landing page, a blog, an area to login/register and an admin-dashboard.
- Fully routed using react-router.
- Lazy loads components to boost performance.
- Components for statistics, text with emoji support, image upload, and more.
Paid
-
- Tool for building web applications.
- Choose your framework and library (React with Material UI).
- Choose your database (SQL, MongoDB or Firestore).
- Model your database and application with the intuitive GUI.
- Generate your application, including a complete scaffolded backend.
- Preview your application online, and download the generated code.
-
- Create a Material UI app in minutes.
- Templates, authentication, database integration, subscription payments, and more.