Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>ionNew to Visual Studio Code? Get it now.
ion

ion

ion design

|
723 installs
| (1) | Free
Easily generate React components from Figma in VS Code
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Ion README

Ion is a developer-native design to code tool. We're specifically created to help developers write front-end code faster and less tediously

How it works

  • Open the ion sidebar in vscode and describe the component you want. You can even reference specific endpoints or props.
  • ​ion will scan your codebase to understand your design system, component libraries, and code style.
  • ion will write context-specific code, meshing into your codebase.
  • Integrate and ship!

Please share the most interesting results on Twitter and tag @iondotdesign

Examples

Here are some examples in wildly different application styles. ion understands the design system and creates components accordingly.

Enjoy!

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft