Devup Figma Plugin

Devup UI provides a powerful Figma plugin that enables seamless integration between design and development workflows. The plugin converts Figma layers into Devup UI code snippets and exports design tokens.

From Figma Community

  1. Open Figma
  2. Go to PluginsBrowse all plugins
  3. Search for "Devup UI"
  4. Click Open in Figma on the Devup UI plugin or go to directly Figma Community page.

Features

Layer to Component Conversion

Convert Figma layers into Devup UI components.

1// Generated from Figma layer
2<Box bg="$primary" borderRadius="8px" color="$text" p="16px">
3  Button Text
4</Box>
1// Generated from Figma layer
2<Box bg="$primary" borderRadius="8px" color="$text" p="16px">
3  Button Text
4</Box>

Design Token Export

Export design tokens from Figma to your devup.json.