Theme Buddy for Ant Design

Theme Buddy is a Figma plugin that keeps your Ant Design theme settings in sync between Figma and your React codebase. Export theme variables as JSON for developers to use directly, or import existing code-side settings back into Figma so both sides of the project reflect the same design decisions.

Try it for free on the Figma Community

The problem it solves

Ant Design projects often suffer from theme drift, where colors, spacing, and typography in Figma slowly diverge from what is configured in ConfigProvider. Theme Buddy closes that gap by making theme settings a single source of truth in either direction.

Export: from Figma to code

The export flow reads variables from the Ant Design System for Figma library and converts them into JSON compatible with Ant Design React 5.0+. Developers can paste the output into ConfigProvider and keep implementation aligned without manual cross-checking.

• Hand off updated brand colors or typography quickly
• Share new theme variants with predictable output
• Keep a reliable snapshot of current token state

Import: from code to Figma

If your React app already has a theme configured, copy those settings into Theme Buddy and apply them to Figma variables automatically. This helps when code is ahead of design or when inheriting existing projects.

• Align Figma when code has changed first
• Reflect developer-side theme updates in design files
• Onboard legacy projects with accurate design state

Free vs full version

The free Figma Community version includes Light Theme export. The full version unlocks dark and compact export plus full import support for light, dark, and compact modes.

Requirements

• Ant Design System for Figma version 5.11 or newer
• Designed specifically for Ant Design System for Figma
• JSON output compatible with Ant Design React 5.0+

Documentation

Full usage instructions are available in the Theme Buddy documentation, including setup, export/import workflows, and troubleshooting.

Try it out

You can try out the light theme Export feature for free—install the Theme Buddy via Figma Community. You need Ant Design System for Figma version 5.11 or newer. If you wish to get the full version of the Theme Plugin and access all features you can purchase it in our Ultimate package.