Register now: Builder for Marketers & Designers

Announcing Visual Copilot - Figma to production in half the time

Builder.io logo
Contact Sales
Platform
Developers
Contact Sales

Blog

Home

Resources

Blog

Forum

Github

Login

Signup

×

Visual CMS

Drag-and-drop visual editor and headless CMS for any tech stack

Theme Studio for Shopify

Build and optimize your Shopify-hosted storefront, no coding required

Resources

Blog

Get StartedLogin

Builder uses AI (Artificial Intelligence) in certain features and workflows to help customers speed up design and development time.

This document covers how Builder incorporates AI and how Builder's AI workflows engage with your data.

Builder may use customer data, dependent on certain factors.

  • Free plans: Builder may use customer data to train and improve the AI.
  • Self-serve paid plans: Customer data may be used to train the AI only if AI content training is toggled On in the customer’s Settings. For instructions on how to control this setting, read Toggle AI content training, later in this document.
  • Enterprise plans: Builder does not use customer data from Enterprise accounts for AI training or improvement purposes.

Builder makes sure that customer data:

  • Cannot be accessed or leveraged by other customers
  • Does not contain any knowingly submitted personal information
  • Is not stored beyond what is necessary for debugging and fixing errors

For features that use external Large Language Models (LLMs), we send those LLMs only the data in prompts and, if applicable, the text or content being edited. This data is necessary for the AI to help with your request. Other AI models we use are entirely internal to Builder. The third-party LLMs we use do not train on your data.

Data is strictly used for providing the requested service. There's no secondary usage of the data used in the request.

Current Builder.io privacy policies apply to all Builder features, including AI features. For more detail about AI at Builder, visit AI Terms.

Builder uses two types of AI models:

  • Builder's proprietary, privacy-first AI models
  • Third-party Large Language Models (LLMs)

Builder's proprietary AI models are fully built and trained internally and hosted on Google Cloud. In this way, these models do not engage with any third party besides Google Cloud, which Builder already uses for all Builder systems.

Builder uses proprietary AI models to:

  • Prepare your Figma file with the Figma plugin
  • Import your design
  • Make your Figma design responsive in the Visual Editor
  • Generate fast code

Some, but not all of Builder's AI features, use fine-tuned external LLMs. Currently, Builder uses LLMs to generate:

  • Images
  • Edit content
  • Edit text
  • Quality code

Builder currently uses OpenAI and Anthropic Claude. We may also potentially use open-source LLMs, such as Mistral or Llama 2. Enterprise plan customers can choose which LLMs to use, including using your own LLM as well as turn off LLM-use entirely.

By understanding which Builder features use AI, how they use AI, and which models they use, you can make informed decisions and be intentional with your workflow.

Though there's a growing feature set using AI in Builder, you can still create and manage your Builder content without using the AI-enhanced features.

The features in which AI is available in Builder include:

Image generation, text generation and editing, and content generation and editing use a fine-tuned LLM to process requests. The following sections show how a prompt is submitted to the LLM and the image, text, or content are returned.

When you use the Visual Editor to generate an image, the prompt that you give in the AI Generate dialogue goes to the LLM, which in turn creates the image. No additional data is sent.

The diagram below shows this flow:

Diagram of Prompt going to an LLM, which in turn creates an image.

When you use the Visual Editor to generate or edit text, the prompt that you give in the Visual Editor AI dialogue goes to the LLM, which in turn creates the copy. If you're editing existing copy, the original text is included in the prompt.

The diagram below shows this flow:

Diagram of Prompt going to an LLM, which in turn creates text.

When you use the Visual Editor to generate or edit content, the prompt that you give in the Visual Editor AI dialogue goes to the LLM, which in turn creates the content. For editing, the specific content being edited is converted to code and sent.

The diagram below shows this flow:

Diagram of Prompt going to the LLM, which in turn creates Builder content.

Builder's Figma plugin leverages AI to take care of the labor-intensive tasks in moments. This workflow uses AI to create a responsive design in Builder's Visual Editor from the Figma import.

When you use Builder's Figma plugin, Builder's proprietary AI models and LLMs are involved at several, but different points in the process:

  1. Builder's Figma plugin sends your design to Builder's proprietary AI models. These models are hosted on Google Cloud (as is all of Builder's infrastructure) to ensure privacy and data security.
  2. Your design is imported to Builder

At this point you can publish your site using Builder's APIs and SDKs. This option relies only on Builder's private, in-house AI models.

OR

Alternatively, you can generate code. When generating code, you have two options:

  • Fast code: this uses a Mitosis compiler without AI.
  • Quality code (optional): this uses a fine-tuned third-party LLM. The third-party LLMs that Builder uses do not train on your data.

When the Builder Figma plugin generates code, it bases the code strictly on your Figma file — not on anyone else's code or designs.

The diagram below charts this process:

Diagram of How Visual Copilot processes your data. 1. Imports with Figma Plugin. 2. Goes to Builder's proprietary AI Models which are privacy first, never trained on customer data, 100% private, and hosted on Google Cloud. 3. Plugin imports your design into Builder.io App with responsive styles. And then Option1: Publish your site with Builder APIs and SDKs or Option 2: Generate "fast" code (uses Mitosis compiler). Then, at your option, Visual Copilot uses a finely tuned LLM at OpenAI to finally create "quality code".

By default, AI features are enabled in Builder, which include AI content and image generation, AI content editing, and generating mini-apps.

To toggle all AI features for all users in the current Space:

  1. Go to Settings for the Space.
  2. For Advanced Settings, click the Edit button.
  3. In the modal that opens, click Labs.
  4. Toggle AIlow AI features off or on as needed.

The video below shows this process in toggling off the Allow AI features setting.

in beta

The ability to toggle the AI content training feature on or off depends on your plan:

PlanAI content training status

Free

On, cannot be toggled off

Self-serve paid

On, but can be toggled off

Enterprise

Off, cannot be toggled on

When AI content training is toggled to on, Builder uses your content to train AI models. However, regardless of plan, Builder anonymizes data to protect your privacy.

For self-serve paid plans only, you can prevent the AI from using content for training:

  1. Go to Settings.
  2. Toggle AI content training to off or on, as needed.

The video below shows these steps.

For more information on AI features in Builder, visit Visual Copilot.

Was this article helpful?

Product

Visual CMS

Theme Studio for Shopify

Sign up

Login

Featured Integrations

React

Angular

Next.js

Gatsby

Get In Touch

Chat With Us

Twitter

Linkedin

Careers

© 2020 Builder.io, Inc.

Security

Privacy Policy

Terms of Service

Newsletter

Get the latest from Builder.io

By submitting, you agree to our Privacy Policy

Product

Platform Overview

Integrations

What's New

Open Source

Builder

Builder

Mitosis

Mitosis

Mitosis

AI Shell

Mitosis

Micro Agent

Mitosis

GPT Crawler

Qwik

Qwik

Partytown

Partytown

Popular Guides

From Design to Code Guide

Composable Commerce Guide

Headless CMS Guide

Headless Commerce Guide

Composable DXP Guide

Design to Code

Resources

Blog

Knowledge Base

Community Forum

Partners

Templates

Success Stories

Showcase

Resource Center

Frameworks

React

React

Next

Next.js

Qwik

Qwik

Gatsby

Gatsby

Angular

Angular

Vue

Vue

Svelte

Svelte

Remix logo

Remix

Nuxt

Nuxt

Hydrogen

Hydrogen

See All

© 2024 Builder.io, Inc.

Security

Privacy Policy

SaaS Terms

Security & Compliance

Cookie Preferences

Gartner Cool Vendor 2024