With more than 60 crafted components that you can use out of the box.

Extensive design tokens can be customized to build your own theme. Two ways of customization are supported:

• With less-loader
• Design Lab - Recommended!

Material market provides a one-stop solution for materials management. Reuse customized modules to make a breakthrough in efficiency.

All components are written in TypeScript so it's type friendly.

Available as an npm package

// with npm
npm install @arco-design/web-react

// with yarn
yarn add @arco-design/web-react

import React from 'react';
import ReactDOM from 'react-dom';
import { Button } from '@arco-design/web-react';
import '@arco-design/web-react/dist/css/arco.css';

function App() {
  return (
    <Button type='secondary'>
      Hello World
    </Button>
  );
}

ReactDOM.render(<App />, document.getElementById('app'));

• Documentation website
• Components documentation
• Dark mode
• Theme customization
• Figma component library
• Awesome Arco
• Bundler Plugins

IE / Edge	Firefox	Chrome	Safari	Opera	Electron
Edge 16	31	49	31	36	last 2 versions

Developers interested in contributing should read the Code of Conduct and the Contributing Guide.

Thank you to all the people who already contributed to ArcoDesign!

This project is MIT licensed.