skills.rest
bergside
bergsideOFFICIAL
Explore all skills by this author →
WebsiteGitHub

ant

Define enterprise Ant Design tokens, typography, and WCAG 2.2 AA interaction states.

2.3k|211|Updated Mar 9, 2026
Search Tags:#accessibility#design system#design tokens#enterprise#ui components#ant design
One-click install
npx skills add https://github.com/bergside/awesome-design-skills --skill ant-bergside
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ant
Source: https://github.com/bergside/awesome-design-skills/tree/main/skills/ant
Command: npx skills add https://github.com/bergside/awesome-design-skills --skill ant-bergside

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It provides consistent, implementation-ready design-system rules for building Ant Design interfaces that stay clear, accessible, and efficient in data-dense enterprise apps.

Core Features & Use Cases

  • Design foundations: codifies enterprise, data-dense styling with a specific typography scale (12/14/16/20/24/32), font choices (Plus Jakarta Sans + JetBrains Mono), a defined color token set, and spacing/rounding rules.
  • Component authoring guidance: instructs engineers/designers to apply structured do/don’t patterns, preserve hierarchy, and keep interaction states explicit across components and variants.
  • Accessibility and quality gates: mandates WCAG 2.2 AA-aligned keyboard-first behavior, visible focus states, and testable acceptance criteria suitable for code review.

Quick Start

Use the ant skill to generate Ant Design component guidelines and QA checks for an enterprise dashboard UI with keyboard-first accessibility.

Frequently Asked Questions about ant

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I standardize Ant Design tokens for enterprise web apps?▼

Standardize Ant Design tokens by codifying enterprise-focused typography, spacing, color sets, and rounding rules to maintain consistent styling in data-dense web applications. This approach ensures clear hierarchy and implementation-ready design system rules.

What are the best ways to handle Ant Design component interaction states?▼

Handle Ant Design interaction states explicitly by defining do and don't patterns across hover, focus-visible, active, disabled, loading, and error variants. This preserves visual hierarchy and ensures consistent UI behavior across all components.

How do I meet WCAG 2.2 AA keyboard-first requirements in Ant Design?▼

Meet WCAG 2.2 AA keyboard-first requirements by mandating visible focus states, explicit interaction-state handling, and testable QA acceptance criteria during component authoring. This enforces accessible behavior suitable for enterprise code review.

Does this Ant Design guidance work for data-dense enterprise dashboards?▼

Yes, this guidance works for data-dense enterprise dashboards by applying a specific typography scale featuring Plus Jakarta Sans and JetBrains Mono fonts alongside structured spacing rules. It generates component guidelines and QA checks tailored for dashboard UIs.

How do I generate testable QA acceptance criteria for Ant Design components?▼

Generate testable QA acceptance criteria for Ant Design components by applying accessibility quality gates that mandate keyboard-first behavior and visible focus states. Use the provided design foundations and do or don't rules to validate code review readiness.

Related Skills

Explore More Design & Creative Skills→
AshesOfTheUndeadAshesOfTheUndead

ant

Generate design guidelines for enterprise UI components using Ant design tokens and WCAG 2.2 AA standards.

Community
Intermediate
bergsidebergside
2.3k

lingo

Generate implementation-ready design-system guidance for Lingo UI components with WCAG 2.2 AA constraints.

Official
Intermediate
PiercingXXPiercingXX
1

ant

Generate accessibility-focused Ant Design guidance with token-driven UI constraints.

Community
Advanced
superpollo02superpollo02

ant

Generate Ant Design UI guidance with WCAG 2.2 AA accessibility rules.

Community
Intermediate