logoAnt Design

⌘ K
  • Design
  • Development
  • Components
  • Blog
  • Resources
YouMindTRACTIANLobeHubCodeRabbit
6.4.5
  • Ant Design of React
  • Component Token
  • Disable Motion
  • Dynamic Theme
  • First Example
  • Local Theme
  • Modify Theme Token
  • Preset Algorithm
  • Use Token
  • Changelog
    v6.4.5
  • Basic Usage
    • Getting Started
    • Usage with Vite
    • Usage with Next.js
      UPDATED
    • Usage with Umi
    • Usage with Rsbuild
    • Usage with Farm
    • Usage with Refine
  • Others
    • Sponsor
  • AI
    • For Agents
      NEW
    • LLMs.txt
      NEW
    • MCP Server
      NEW
    • CLI
      NEW
  • Advanced
    • Customize Theme
    • CSS Compatible
    • Server Side Rendering
    • Use custom date library
    • Internationalization
    • Common Props
  • Migration
    • From v5 to v6
  • Other
    • Third-Party Libraries
    • Contributing
    • FAQ
What is Ant Design CLI?
Highlights
Install
Quick Start
Commands
Knowledge Query
Project Analysis
Issue Reporting
CLI Management
Global Flags
Environment Variables
Usage with AI Tools
Learn More

CLI

Docs
Edit this pageLLMs.md
MCP ServerCustomize Theme

Resources

Ant Design X
Ant Design Charts
Ant Design Pro
Pro Components
Ant Design Mobile
Ant Design Mini
Ant Design Web3
Ant Design Landing-Landing Templates
Scaffolds-Scaffold Market
Umi-React Application Framework
dumi-Component doc generator
qiankun-Micro-Frontends Framework
Ant Motion-Motion Solution
China Mirror 🇨🇳

Community

Awesome Ant Design
Medium
X
yuque logoAnt Design in YuQue
Ant Design in Zhihu
Experience Cloud Blog
seeconf logoSEE Conf-Experience Tech Conference

Help

GitHub
Change Log
FAQ
For Agents
Bug Report
Issues
Discussions
StackOverflow
SegmentFault

Ant XTech logoMore Products

yuque logoYuQue-Document Collaboration Platform
AntV logoAntV-Data Visualization
Egg logoEgg-Enterprise Node.js Framework
Kitchen logoKitchen-Sketch Toolkit
Galacean logoGalacean-Interactive Graphics Solution
WeaveFox logoWeaveFox-AI Development with WeaveFox 🦊
xtech logoAnt Financial Experience Tech
Theme Editor
Made with ❤ by
Ant Group and Ant Design Community
loading

This guide explains how to use @ant-design/cli to query Ant Design component knowledge, analyze project usage, and guide migrations from the command line.

What is Ant Design CLI?

@ant-design/cli is an official command-line tool that brings Ant Design knowledge to your terminal. It ships all metadata locally — every prop, token, demo, and changelog entry for antd v3 / v4 / v5 / v6 — queryable in milliseconds, fully offline.

Highlights

  • Fully offline — All metadata ships with the package. No network calls, no latency, no API keys.
  • Version-accurate — 55+ per-minor snapshots across v3/v4/v5/v6. Query the exact API surface of any version.
  • Agent-optimized — --format json on every command. Structured errors with codes and suggestions.
  • Bilingual — Every component name, description, and doc has both English and Chinese. Switch with --lang zh.
  • Smart matching — Typo Buttn? The CLI suggests Button using Levenshtein distance.
  • 18 commands — From prop lookup to project-wide lint, from design tokens to MCP/Skill setup.

Install

bash
npm install -g @ant-design/cli

Requires Node.js >=20.0.0. You can also install globally with pnpm add -g @ant-design/cli or bun add -g @ant-design/cli.

Quick Start

bash
antd list                           # All components with versions
antd info Button                    # Component props, types, defaults
antd doc Button                     # Full markdown documentation
antd demo Select basic              # Runnable demo source code
antd token DatePicker               # Design Token values (v5+)
antd design.md                      # Design-language document (design.md)
antd semantic Table                 # classNames / styles structure
antd changelog 4.24.0 5.0.0 Select  # API diff across versions
antd doctor                         # Diagnose project issues
antd env                            # Collect env info for bug reports
antd usage ./src                    # Analyze antd imports in project
antd lint ./src                     # Check deprecated APIs & best practices
antd migrate 3 4                    # v3 to v4 migration guide
antd migrate 4 5 --apply ./src      # Agent-ready migration prompt
antd mcp                            # Start MCP server for IDE integration
antd setup --client claude          # Set up MCP/Skill for AI agents
antd upgrade                        # Upgrade CLI to latest version

Commands

Knowledge Query

CommandDescription
antd listList all components with bilingual names, categories, and since versions
antd info <Component>Props table with types, defaults, since, and deprecated status
antd doc <Component>Full markdown documentation for a component
antd demo <Component> [name]Runnable demo source code (TSX)
antd token [Component]Global or component-level Design Tokens
antd design.mdDesign-language document for AI design tools
antd semantic <Component>Semantic classNames / styles structure with usage examples
antd changelog [v1] [v2] [component]Changelog entries, version ranges, or cross-version API diff

antd design.md

antd design.md outputs the design language description file for Ant Design, conformant with the google-labs-code/design.md specification. This file is intended for AI design tools (Figma Make, Google Stitch, etc.) so they can generate UI that follows Ant Design's visual language.

bash
antd design.md                # Output the full design.md content
antd design.md --format json  # JSON format output
antd design.md --lang zh      # Chinese descriptions

The file includes:

  • YAML front-matter — Structured token definitions for colors, typography, rounded corners, spacing, and core components, with {path.to.token} reference syntax
  • Overview — Ant Design's four design values (Natural, Certain, Meaningful, Growing)
  • Colors — Functional colors, preset palette, and why neutrals use rgba()
  • Typography — 14px base font size, font stack, two-weight constraint
  • Layout — 4px grid, spacing scale, three-layer surface model
  • Elevation & Depth — Four shadow tiers, motion durations and easings
  • Shapes — 6px default radius and per-component classifications
  • Components — Style descriptions for core component archetypes and states
  • Do's and Don'ts — Design guidance rules

The file is also published at ant.design/design.md and can be read directly by AI tools via URL.

Project Analysis

CommandDescription
antd doctor10 diagnostic checks: React compat, duplicates, peer deps, SSR, babel plugins
antd env [dir]Collect all antd-related environment information for bug reports or AI diagnosis
antd usage [dir]Import stats, sub-component breakdown (Form.Item), non-component exports
antd lint [target]Deprecated APIs, accessibility gaps, performance issues, best practices
antd migrate <from> <to>Migration checklist with auto-fixable/manual split and --apply agent prompt

Issue Reporting

CommandDescription
antd bugSubmit a bug to the ant-design repository
antd bug-cliSubmit a bug to the ant-design-cli repository

CLI Management

CommandDescription
antd mcpStart an MCP server with 8 tools and 2 prompts for IDE integration (Claude Code, Cursor, VS Code, etc.)
antd setupSet up Ant Design MCP/Skill for Claude Code, Cursor, VS Code, or Codex
antd upgradeUpgrade the CLI to the latest version

The antd mcp command launches a Model Context Protocol server, allowing AI assistants to access Ant Design knowledge directly. See the MCP Server guide for full details and configuration.

The antd setup command can write MCP configuration, install the bundled Ant Design skill, or both:

bash
antd setup --client claude
antd setup --client cursor --mode both
antd setup --client vscode --write-instructions
antd setup --client codex
antd setup --client claude --dry-run
antd setup --client claude --check

Global Flags

FlagDescriptionDefault
--format json|text|markdownOutput formattext
--version <v>Target antd version (e.g. 5.20.0)auto-detect
--lang en|zhOutput languageen
--detailInclude extended informationfalse
-V, --cli-versionPrint the CLI version-

Version auto-detection order: --version flag, node_modules/antd, package.json dependencies, then fallback.

Environment Variables

VariableDescription
ANTD_NO_AUTO_REPORT=1Disable AI-agent bug-reporting suggestions
NO_UPDATE_CHECK=1Skip the silent version update check
CI=1Skip the silent version update check, same as NO_UPDATE_CHECK=1

Usage with AI Tools

The CLI ships with a built-in skill file that teaches code agents when and how to use each command:

bash
npx skills add ant-design/ant-design-cli
ToolDescription
Claude CodeInstall as agent skill or use antd commands directly in terminal. Documentation
CursorInstall skill, the agent will call CLI commands automatically. Documentation
CodexInstall skill to enable agent access. Documentation
Gemini CLIInstall skill for automatic command invocation. Documentation

Works with any agent supporting the skills protocol.

Learn More

  • @ant-design/cli on GitHub
  • @ant-design/cli on npm
  • Ant Design LLMs.txt Guide
  • Ant Design MCP Server