Ant Design vs. Material UI

So Ant Design(54,504 stars) has surpassed Material UI(53,012 stars) in github. 😎

Which do you use? If not these 2, how do you style your UI?

You can also vote in Twitter. Will post results here once polling is closed.

ant-design / ant-design

An enterprise-class UI design language and React UI library

Ant Design

An enterprise-class UI design language and React UI library.

English | 中文

✨ Features

• 🌈 Enterprise-class UI designed for web applications.
• 📦 A set of high-quality React components out of the box.
• 🛡 Written in TypeScript with predictable static types.
• ⚙️ Whole package of design resources and development tools.
• 🌍 Internationalization support for dozens of languages.
• 🎨 Powerful theme customization based on CSS-in-JS.

🖥 Environment Support

• Modern browsers
• Server-side Rendering
• Electron

Edge	Firefox	Chrome	Safari	Electron
Edge	last 2 versions	last 2 versions	last 2 versions	last 2 versions

📦 Install

npm install antd

yarn add antd

🔨 Usage

import React from 'react';
import { Button, DatePicker } from 'antd';

const App = () => (
  <>
    <Button type="primary">PRESS ME</Button>
    <DatePicker placeholder="select date" />
  </>
);

TypeScript

…

View on GitHub

mui / material-ui

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

MUI Core

MUI Core contains foundational React UI component libraries for shipping new features faster.

• Material UI is a comprehensive library of components that features our implementation of Google's Material Design system.

• Joy UI is a beautifully designed library of React UI components.

• Base UI is our library of "unstyled" components and low-level hooks. With Base, you gain complete control over your app's CSS and accessibility features.

• MUI System is a collection of CSS utilities to help you rapidly lay out custom designs.

Stable channel v5

Installation

Material UI

Material UI is available as an npm package.

npm:

npm install @mui/material @emotion/react @emotion/styled

yarn:

yarn add @mui/material @emotion/react @emotion/styled

Older versions

• v4.x (Migration from v4 to v5)
• v3.x (Migration from v3 to v4)
• v0.x (Migration to v1)

Note: @next only points to pre-releases Use @latest for the latest stable release.

Base UI

Base…

View on GitHub

Comments

[Ant Design]

I perfer Ant Design in all my products.

[Chanlito]

Right

[O]

What is the difference??