Ant Design
SkillMediaDecision guide for antd 6.x, Ant Design Pro 5/ProComponents, Ant Design X v2, and the offline `@ant-design/cli`. Use for component selection, theming/tokens, SSR, a11y, performance, routing/access/CRUD, AI/chat UI patterns, local API lookup, debugging, migration, and usage analysis.
Use Ant Design in Claude, ChatGPT or Ahel Desktop
Free. Sign in, add Ant Design and connect your AI. About a minute.
Also: Claude Code · Cursor · Codex
Then ask your AI: use the Ant Design skill
Details
Instructions available. Your AI can read the instructions. Execution depends on the setup they require.
Account requirements not reviewed. Check the skill instructions before use; Ahel provides instructions and does not run this skill.
No other account needed.
Add Ahel to your AI once: Claude, ChatGPT, Cursor, Claude Code or Codex. Then ask it to use this.
What this skill tells your AI
The instructions your AI receives, as published by ant-design/antd-skill in skills/ant-design/SKILL.md and read by Ahel’s review.
S - Scope
- Target:
antd@^6+ React 18-19, withant-design-pro@^5/@ant-design/pro-componentsand@ant-design/x@^2when needed. - Tooling:
@ant-design/clifor offline component metadata, demos, changelogs, migrations, linting, doctor checks, and usage analysis. - Focus: decision guidance only; no end-user tutorials.
- Source policy: official docs only; no undocumented APIs or internal
.ant-*coupling.
Default assumptions
- Language: TypeScript.
- Styling: tokens first, then
classNames/styles; avoid global overrides. - Provider: one root
ConfigProviderunless strict isolation is required.
Mandatory rules
- Before writing or changing antd component code, query the component API first with
antd info <Component> --format json. Do not rely on memory when the CLI can answer it offline. - Always use
--format jsonwithantdCLI commands. - If the project version matters, match it with
--version <x.y.z>or let the CLI auto-detect from localnode_modules. - After changing antd code, run
antd lint <changed-path> --format json. - If an
antdCLI command crashes, returns wrong data, or violates its documented behavior, prepare anantd bug-clipreview for user confirmation instead of silently working around it. - For component questions, first map the component name to the official route slug
{components}(lowercase kebab-case, e.g.TreeSelect -> tree-select,Button -> button), then request docs in this order (CN first, EN fallback):https://ant.design/components/{components}-cnhttps://ant.design/components/{components}
- Examples:
tree-select-cn -> tree-select,button-cn -> button.
- Use only documented antd/Pro/X APIs.
- Do not invent props/events/component names.
- Do not rely on internal DOM or
.ant-*selectors. - Theme priority: global tokens -> component tokens -> alias tokens.
P - Process
1) Classify
- Identify layer: core antd, Pro, or X.
- Confirm version, rendering mode (CSR/SSR/streaming), data scale, and whether
@ant-design/clishould be the primary lookup path.
2) Query authoritative sources
- Prefer local
@ant-design/clifirst for structured lookup:antd infofor props/APIantd demofor a working baselineantd docfor full docsantd token/antd semanticfor theming and styling hooksantd doctor,antd lint,antd usage,antd migrate,antd changelogwhen debugging or upgrading
- Then request the official component docs (
-cnfirst, EN fallback) when narrative docs or cross-checking are needed.
3) Decide
- Provider baseline: CSR ->
ConfigProvider; SSR ->ConfigProvider+StyleProvider. - Theming baseline: global tokens -> component tokens ->
classNames/styles. - Output recommendation + risk + verification points (SSR/a11y/perf), citing CLI findings when used.
O - Output
- Provide short decision rationale (1-3 sentences).
- Include minimal provider/theming strategy.
- Include concrete SSR/a11y/perf checks.
- For Pro: include route/menu/access and CRUD schema direction.
- For X: include message/tool schema and streaming state direction.
References
| File | Use when |
|---|---|
references/antd-cli.md | You need the exact offline CLI workflow for API lookup, demos, linting, doctor checks, migration, changelog review, usage analysis, or bug reporting. |
Regression checklist
- One root
ConfigProvider; SSR style order/hydration verified. - Tokens first; no broad global
.ant-*overrides. - Table has stable
rowKey; sort/filter/pagination entry is unified. - Select remote mode disables local filter when using remote search.
- Upload controlled/uncontrolled mode is explicit with failure/retry path.
- Pro route/menu/access remain consistent with backend enforcement.
- X streaming supports stop/retry and deterministic tool rendering.
- If
antdCLI was used, commands ran with--format jsonand any CLI defect was escalated viaantd bug-clipreview.
Signals
- GitHub stars
- 136
- Forks
- 12
- Last commit
- Mar 2026
Ahel review
K1binfo
installs-packages (in references/antd-cli.md)
Automated review, not a security audit. Ruleset v1+k2.
Advanced
- Item type
- skill
- Key
antd-skill-ant-design- Source
- github.com/ant-design/antd-skill
github.com/ant-design/antd-skill
Related picks
Skill · davila7
The pick for Reactreact-doctor
Skill · millionco
The pick for Reactsetup-ts-deep-modules
Skill · mattpocock
The pick for TypeScripttypescript-pro
Skill · jeffallan
The pick for TypeScriptprototype
Skill · mattpocock
More in Mediabrand-guidelines
Skill · anthropics
More in Media