Builder
Product Updates

Now you can copy any website layout to Builder with our Chrome extension. Hover over the section you want to copy, click, and paste it into Builder. Then, you can quickly edit and publish it or turn it into clean code for your codebase. Download it here.

We’re bringing our AI Assistant, Visual Copilot, to the Visual Editor. Using the new feature, you can use natural language to add functionality, animations, and real data from your APIs to designs in the visual editor - bringing designs to life. Learn more.

Developers can now generate automated tests directly from the Visual Copilot UI.

Locale grouping allows you to bucket locales into relevant groups so you can more easily manage many locales and introduce a secondary fallback system for locales that may share similarities. For example, French (Germany) and French (Belgium) can fallback to French (France), while English (Mexico) and English (Canada) fallback to English (US). Learn More

Space-level custom instructions allow teams to standardize generated code output across their organization. By saving custom prompts that apply to all Visual Copilot code generations, teams ensure the code matches their team’s code semantics and standards. Space-level custom instructions are currently available for growth and enterprise plans.

Visual Copilot now lets you generate Swift (iOS), Kotlin (Android), and Flutter code from your Figma designs. Learn more.

The page hierarchy view, now integrated into the content list, helps teams with many pages more clearly navigate and organize large-scale projects with many pages. The page hierarchy view automatically organizes all your Builder pages into a folder and file structure based on their route. Page Hierarchy is available today in beta for all enterprise plans. Learn more.

We've improved our Visual Editor’s history tracking by letting you add custom messages to history items, providing context for changes. Additionally, when publishing, users can include notes describing the modifications made.

Visual Copilot now makes it cleaner to read, navigate, and integrate generated code by also creating a structured directory for the code with files separated into logical components and folders like a professional developer would.

Component Mapping is now available for Angular apps. Component Mapping with Visual Copilot syncs your Figma components to your Angular components and generates code that leverages your components when you have them. Learn more.

We 8x'd the size of designs that Basic, Growth, and Enterprise plan users can turn into code with Visual Copilot. We increased the context size for quality code generations from 16k to 128k tokens. Plus, we increased the speed at which Visual Copilot generates code in quality mode.

Use design tokens with the Visual Editor to maintain visual consistency across your site and app. Design tokens let you define a consistent set of values, such as colors, spacing, fonts, and more, so experiences built with the Builder Visual Editor stick to your brand guidelines. Learn more.