Ant Design Pro

An out-of-box UI solution for enterprise applications as a React boilerplate.

Language: English | 简体中文

• Preview: https://preview.pro.ant.design
• Documentation: docs/cheatsheet.en-US.md
• ChangeLog: https://github.com/ant-design/ant-design-pro/releases
• FAQ: docs/cheatsheet.en-US.md#faq
• v6 Released! — What's new in v6

Features

• 💡 TypeScript: A language for application-scale JavaScript
• 📜 Blocks: Build page with block template
• 💎 Neat Design: Built on Ant Design 6 specification
• 📐 Common Templates: Typical templates for enterprise applications
• 🚀 State of The Art Development: Newest development stack of React 19/Umi Max 4/antd 6/utoopack
• 📱 Responsive: Designed for variable screen sizes
• 🎨 Theming: Customizable theme with Tailwind CSS v4 + antd-style
• 🌐 International: Built-in i18n solution
• ⚙️ Best Practices: Solid workflow to make your code healthy
• 🔢 Mock development: Easy to use mock development solution
• 🤖 AI Assistant: Built-in AI chatbot page powered by Ant Design X
• ✅ UI Test: Fly safely with unit and e2e tests

Templates

- Welcome
- Dashboard
  - Analysis
  - Monitor
  - Workplace
- Form
  - Basic Form
  - Step Form
  - Advanced Form
- List
  - Search List (Articles/Projects/Applications)
  - Table List
  - Basic List
  - Card List
- Profile
  - Basic Profile
  - Advanced Profile
- Result
  - Success
  - Fail
- Exception
  - 403
  - 404
  - 500
- Account
  - Account Center
  - Account Settings
- AI Assistant
- User
  - Login
  - Register
  - Register Result

Usage

Get Started

Clone or download this repository to your local machine:

git clone --depth=1 https://github.com/ant-design/ant-design-pro.git myapp
cd myapp

Installation

npm install

Development

# Start development server (full version by default)
npm start

Simplify to Simple Version

This project includes all blocks by default. If you need a minimal version, run:

npm run simple

This will:

• Remove extra page directories (dashboard, form, list/*, profile, result, exception, account, etc.)
• Remove extra mock files
• Replace routes with simple version
• Remove extra dependencies from package.json

Note: This operation is irreversible and will permanently delete files.

Build

npm run build

AI Skills (Claude Code)

This project ships with two built-in Claude Code Skills in .claude/skills/:

Skill	Trigger	Description
/pro-upgrade	"upgrade pro", "update to latest"	Auto-upgrade to the latest Ant Design Pro version. Diffs the latest template, merges framework changes while preserving your business code.
/antd	antd-related code or questions	Query antd component APIs, props, tokens, demos; lint for deprecated usage; migrate between versions — all via @ant-design/cli.

Usage in Claude Code:

# Upgrade the project to latest Pro version
/pro-upgrade

# Query antd component info, debug issues, run lint, etc.
/antd

💡 If your project was cloned from this repo, these skills are already included — no installation needed. To get the latest skill definitions, pull the updates from the template or run npx skills add ant-design/ant-design-pro to refresh them.

Browsers support

Modern browsers.

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

Contributing

Any type of contribution is welcome, here are some examples of how you may contribute to this project:

• Use Ant Design Pro in your daily work.
• Submit issues to report bugs or ask questions.
• Propose pull requests to improve our code.