Skills
.Work. You
Rest

antd-style-to-tailwind

Official

Migrate Ant Design styles to Tailwind.

Software Engineering#tailwind#migrate#migration-guide#dark-mode#frontend-design#css-in-js#antd
Authordtyq
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Migrate Ant Design styles from CSS-in-JS patterns (createStyles) to Tailwind utility classes to ensure consistent styling, easier theming, and reliable dark-mode support across a codebase.

Core Features & Use Cases

  • Audit and identify Ant Design style definitions in styles.ts and createStyles usage.
  • Translate CSS properties and Ant Design tokens into Tailwind utilities, mapping tokens to semantic equivalents and preserving layout behavior.
  • Replace Ant Design components and patterns (Button, Input, layout primitives) with Tailwind-based equivalents, including import changes and className updates.
  • Use cases include migrating legacy components, upgrading design systems, or scaffolding new components in files that currently use antd-style patterns.

Quick Start

Identify a component using createStyles and migrate its styles to Tailwind following this guide.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: antd-style-to-tailwind
Download link: https://github.com/dtyq/magic/archive/main.zip#antd-style-to-tailwind

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.