is now part of Shuffle™. You can use the editor on this domain, but we encourage you to try Shuffle.dev. Shuffle™ includes templates for Material-UI, Bootstrap, Bulma, and Tailwind CSS.

Redirecting to PayPal

Create React websites in minutes.

An online editor for Material-UI with a simple, intuitive drag & drop interface and ready-made React components.
How it works

Speed up your development process in three easy steps.

Drag & drop. Customize. Improve in your favorite IDE.

1

Choose UI components

Use ready-made React components from the multipurpose library grouped into the most frequently used categories.

2

Customize Material-UI styles

We have 180+ Material-UI variables in thematically connected categories to allow you to work effectively.

3

Export a React codebase

When you select the appropriate components and settings, you can download source files to start integrating it with back-end.

Features

Editor designed for busy developers.

Our goal is to speed up your work. We do not use any external dependencies apart from those used by Material-UI.

Easy to use

We know how valuable developers' time is. This is why we worked hard on the development of a tool that would be easy to use and which you could make use of without the need for any training.

Components library

Build templates from library of Material-UI components grouped into most frequently used categories including navigations, headers and more. Choose the right components and focus on the details.

Online theme compilation

Material-UI provides a lot of configuration options. Our customizer panel displays these options in thematically connected categories and it will allow you to use them effectively.

Convenient pickers

All types of settings include an interface for a quicker implementation of values (color picker, Google Fonts autosuggest, shadow builder, etc.).

Live edit

When changing the settings in customizer panel, the Material-UI theme is compiled in real time, and you can follow the changes live.

Shareable preview

You can share the prepared project with other team members to review, or you can use a link to check the project on mobile devices.

Too often developers don't have time to implement their designs perfectly.

That's why we have built an editor that will help you move faster from building a layout to the refining stage so that you can have time to work on the details.

Get the whole bundle (Shuffle™) 👇
#1 Premium Bundle

The easiest way to create beautiful Material-UI websites.


The selected plan includes lifetime access to Shuffle™.

A lifetime license is best for those who create several projects per year.

Buy a Lifetime License

Two themes and hundreds of ready-made React UI components.

Works with Material-UI v4.11.0.

Free updates with new UI kits and styles.

Shuffle extension for Visual Studio Code with all UI components.

Access to Shuffle™ without additional costs. Shuffle is an online editor for Material-UI, Bootstrap, Bulma, and Tailwind CSS.

Shuffle

Product Roadmap 20/21

November 2020

✅  Release of the Metis Shuffle, our second custom-made UI component library for Tailwind Builder .

Metis Shuffle theme preview

✅  Visual Studio Code extension that allows you to use all our components from within the editor. Please sign in and follow the instruction in the "Account -> VSC Extension" menu to install it.

December 2020

✅  Bootstrap 5 support in the Bootstrap Shuffle .

✅  Port of the Metis Shuffle library for Bootstrap 5.

✅  Port of the Metis Shuffle for Bulma CSS (Bulma Builder ).

January 2021

✅   We combined all our editors into one product: Shuffle .

All accounts and projects were transferred automatically. You can sign in to Shuffle using the same login details as to Material-UI Builder.

Shuffle Visual Editor
Q1 2021

Visual Editor v2.

A marketplace for creators to share their templates and design systems.

Figma-style team work.