Skip to content

AI modes

Pick a mode to tell WeWeb AI what you want to do. Each mode focuses the AI on a specific task so you get clearer, more accurate results.

Quick reference

ModeBest forAvailability
Buildcreating/updating page design, data bindings, workflows, and formulasalways
Askquestions about WeWeb and your selected contextalways
Coded componentgenerating or editing custom coded componentsalways
Supabasemanaging tables, functions, and auth in your connected projectalways (will require you to connect your Supabase project to interact with Supabase)
Formulaediting the formula that is openwhen formula editor is open
Workflowediting the workflow that is openwhen workflow editor is open

The mode selector

Open the Select an AI mode menu in the chat. Available modes change based on what you’re doing.

AI mode selector

TIP

Modes that target a single item, like Formula and Workflow, only appear when the relevant editor is open.

Build

Build focuses on your current page. Use it to design layouts, style elements, connect data, and attach or create workflows and formulas. It’s the default choice when you’re building features or updating existing UI.

Try:

"Create a product card with image, title, price, and an add-to-cart button"

"On submission of this form, I want to use my registration workflow"

Ask

Ask answers questions about WeWeb and about the context you provide. Use it when you need clarity before changing anything, or to troubleshoot and learn best practices.

Try:

"How does this workflow handle authentication?" "Explain how collections are used on this page"

TIP

Ask works best with context. Pass the page, element, workflow, or formula you care about to get tailored explanations.

Coded component

Coded component creates or edits custom components. Generate new components from a description, add properties or events, and extend behavior when native elements aren’t enough.

Try:

"Create a dual-range slider with min/max and onChange event" "Add a loading state property to this custom component"

Supabase

Supabase manages your connected backend: create or modify tables, generate functions/APIs, and configure auth and relationships. Requires the Supabase plugin and a connected project.

Try:

"Create a products table with name, price, description, category" "Generate a function to calculate shipping by destination"

Formula

Formula edits the formula that’s currently open. Use it to add conditions and calculations, or to fix errors and improve readability.

Try:

"I want the price calculated to have a discount if the user is logged in" "Handle empty values safely in this formula"

Workflow

Workflow edits the workflow that’s currently open. Add actions, conditions, error handling, or integrate with other workflows. Open the workflow editor first.

Try:

"Add error handling if this workflow fails" "I want to show a confirmation popup at the end of the workflow"

Tips for choosing a mode

  • start with Build for most page work
  • switch to Ask when you need clarity first
  • use Formula, Workflow, or Coded component when you’re focused on one item
  • use Supabase for tables, functions, and auth in your connected project

Examples

Build a new feature

  1. Ask: "What’s the best way to implement favorites?"
  2. Build: "Add a heart icon that toggles favorites"
  3. Supabase: "Create a user_favorites table"

Debug a problem

  1. Ask: "Why doesn’t this button trigger the workflow?"
  2. Build: "Fix the click event so it runs the workflow"

Create custom functionality

  1. Ask: "Do we have a native image cropper?"
  2. Coded component: "Create an image cropper with drag handles"
  3. Build: "Add it to the profile page"