antd

An enterprise-class UI design language and React components implementation

  • antd

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
antd
89,8781,0875.15.44 days ago9 years agoMinified + gzip package size for antd in KB

Readme



Ant Design

An enterprise-class UI design language and React UI library.
!CI statusgithub-action-imagegithub-action-url !codecovcodecov-imagecodecov-url !NPM versionnpm-imagenpm-url !NPM downloadsdownload-imagedownload-url
!bundlephobia-imagebundlephobia-url !bundlesize-js-imageunpkg-js-url !FOSSA Statusfossa-imagefossa-url
!Follow Twittertwitter-imagetwitter-url !Renovate statusrenovate-imagerenovate-dashboard-url !issues-helper-imageissues-helper-url !dumidumi-imagedumi-url !Issues need helphelp-wanted-imagehelp-wanted-url
Changelog · Report Buggithub-issues-url · Request Featuregithub-issues-url · English · 中文


<source media="(prefers-color-scheme: dark)" srcset="https://next.ossinsight.io/widgets/official/compose-last-28-days-stats/thumbnail.png?repo_id=34526884&image_size=auto&color_scheme=dark" width="655" height="auto">
<img alt="Performance Stats of ant-design/ant-design - Last 28 days" src="https://next.ossinsight.io/widgets/official/compose-last-28-days-stats/thumbnail.png?repo_id=34526884&image_size=auto&color_scheme=light" width="655" height="auto">



✨ 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
Edge | Firefox
Firefox | Chrome
Chrome | Safari
Safari | Electron
Electron | | --- | --- | --- | --- | --- | | Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |

📦 Install

npm install antd

yarn add antd

pnpm add antd

🔨 Usage

import { Button, DatePicker } from 'antd';

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

🔗 Links

⌨️ Development

Use Gitpod, a free online dev environment for GitHub.
Open in Gitpod
Or clone locally:
$ git clone git@github.com:ant-design/ant-design.git
$ cd ant-design
$ npm install
$ npm start

Open your browser and visit http://127.0.0.1:8001 , see more at Development.

🤝 Contributing PRs Welcome


<source media="(prefers-color-scheme: dark)" srcset="https://next.ossinsight.io/widgets/official/compose-recent-active-contributors/thumbnail.png?repo_id=34526884&limit=30&image_size=auto&color_scheme=dark" width="655" height="auto">
<img alt="Active Contributors of ant-design/ant-design - Last 28 days" src="https://next.ossinsight.io/widgets/official/compose-recent-active-contributors/thumbnail.png?repo_id=34526884&limit=30&image_size=auto&color_scheme=light" width="655" height="auto">


Let's build a better antd together.
We welcome all contributions. Please read our Contributing Guide first. You can submit any ideas as Pull Requests or as GitHub Issues. If you'd like to improve code, check out the Development Instructions and have a good time! :)
If you are a collaborator, please follow our Pull Request Principle to create a Pull Request with our Pull Request Template.
Let's fund issues in this repository

❤️ Sponsors and Backers