# Codegen plugins (and other tips) for automating design to code

DevFeed: [Codegen plugins (and other tips) for automating design to code](<https://devfeed.tech/articles/codegen-plugins-and-other-tips-for-automating-design-to-code-9677.md>)

Original publisher: [Read original article](<https://www.figma.com/blog/figma-dev-mode-codegen-plugins/>)

Author: Figma

Published: 2024-04-11T00:00:00Z

Content type: article

Language: en

Sources: [Figma Blog](<https://devfeed.tech/sources/figma-blog.md>)

Topics: [Figma](<https://devfeed.tech/topics/figma.md>), [Code generation](<https://devfeed.tech/topics/code-generation.md>), [Code](<https://devfeed.tech/topics/code.md>), [Figma plugin design](<https://devfeed.tech/topics/figma-plugin-design.md>), [React](<https://devfeed.tech/topics/react.md>), [HTML](<https://devfeed.tech/topics/html.md>), [CSS](<https://devfeed.tech/topics/css.md>), [Tailwind CSS](<https://devfeed.tech/topics/tailwind.md>), [Svelte](<https://devfeed.tech/topics/svelte.md>), [Artificial Intelligence](<https://devfeed.tech/topics/ai.md>), [Flutter](<https://devfeed.tech/topics/flutter.md>), [SwiftUI](<https://devfeed.tech/topics/swiftui.md>)

Tags: [code](<https://devfeed.tech/tags/code.md>), [css](<https://devfeed.tech/tags/css.md>), [dev](<https://devfeed.tech/tags/dev.md>), [figma](<https://devfeed.tech/tags/figma.md>), [flutter](<https://devfeed.tech/tags/flutter.md>), [generate](<https://devfeed.tech/tags/generate.md>), [open-source](<https://devfeed.tech/tags/open-source.md>), [plugins](<https://devfeed.tech/tags/plugins.md>), [react](<https://devfeed.tech/tags/react.md>), [svelte](<https://devfeed.tech/tags/svelte.md>), [swiftui](<https://devfeed.tech/tags/swiftui.md>), [tailwind](<https://devfeed.tech/tags/tailwind.md>), [ui](<https://devfeed.tech/tags/ui.md>)

## AI overview

This article presents Figma Dev Mode codegen plugins that help developers translate designs into code. It explains codegen as an aid to the design-to-development workflow and highlights plugins that generate or refine HTML, React, Svelte, Tailwind, Flutter, and SwiftUI code, including AI-assisted and open-source options.

## Source excerpt

Dev Mode helps you go from design to code faster. We've curated some of our top codegen plugins and tips to help you get the most out of your workflow.