@apdesign/web-react
v1.0.0
Published
Arco Design React UI Library.
Downloads
99
Readme
A comprehensive React UI components library based on the Arco Design system.
English | 简体中文
https://user-images.githubusercontent.com/19399269/141435899-e453cf75-d50f-4549-b8d0-37daebe46c36.mp4
Features
Comprehensive
With more than 60 crafted components that you can use out of the box.
Customizable theme
Extensive design tokens can be customized to build your own theme. Two ways of customization are supported:
- With less-loader
- Design Lab - Recommended!
Reusable custom materials
Material market provides a one-stop solution for materials management. Reuse customized modules to make a breakthrough in efficiency.
TypeScript friendly
All components are written in TypeScript so it's type friendly.
Installation
Available as an npm package
// with npm
npm install @arco-design/web-react
// with yarn
yarn add @arco-design/web-react
Examples
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'));
Useful Links
- Documentation website
- Components documentation
- Dark mode
- Theme customization
- Figma component library
- Awesome Arco
- Bundler Plugins
Ecosystems
| Project | Description | | --------------------- | ------------------------------------------------------- | | Vue Component Library | A comprehensive Vue UI components library based on the Arco Design system | | Design Lab | A platform to create and manage your themes with ease. | | Material Market | A platform that provides massive high-quality customized materials to greatly boost development efficiency. | | Icon Box | One-stop platform to manage your icons. | | Arco Pro | A solution to quickly building applications from scratch. |
Browser Support
| IE / Edge | Firefox | Chrome | Safari | Opera | Electron | | --------- | --------- | --------- | --------- | --------- | --------- | | Edge 16| 31| 49 | 31 | 36 | last 2 versions |
Contributing
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!
License
This project is MIT licensed.