Tweak sections with AI before you copy them

Edit with AI is a small, focused editor for quick changes — best for small visual or content tweaks, not major layout overhauls. Describe the change, AI applies it, then copy the result.

Edit with AI is a beta feature that lets you make small modifications to any section directly on BYQ — without leaving the section popup. You describe the change in plain language, AI applies it to the section, and whatever you see in the preview is what gets copied when you click Copy.

It’s designed for small tweaks. Highlighting a tile, swapping out an image, changing the order of icon and text, making one heading bigger, switching a label color. It’s not designed for adding new content blocks from scratch or building new sections entirely.

How to use Edit with AI
  1. Open any section on BYQ.
  2. Click the wand icon (“Edit with AI”) in the top right of the section popup.
  3. The Edit with AI panel opens on the right side, with a prompt field at the bottom.
  4. Optionally pick a target element using the “Target element” picker, if you want the change applied to a specific part of the section. Leaving it unset applies the change broadly.
  5. Describe the change in the prompt field — something like “highlight one tile with the accent color” or “swap the icon and text positions.”
  6. Hit submit. AI applies the change, the preview updates, and the diff of CSS modifications is shown in the panel.
  7. Iterate if you want. You can keep prompting to refine, undo with the undo arrow, or reset to start over.
  8. When you’re happy, copy the section. The version showing in the preview is what gets copied.

What Edit with AI is good at

Small, well-scoped changes consistently produce the best results:

  • Highlighting elements — “Highlight one tile,” “Make the second card stand out,” “Add an accent border to the first item.”
  • Swapping images — “Replace all images with dogs,” “Use cat images instead,” “Swap the avatar for a different illustration.”
  • Restyling small details — “Make the heading bigger,” “Change the icon color to match the accent,” “Add more spacing between the cards.”
  • Reordering or rearranging within a tile — “Switch the icon and the title position,” “Move the price below the description.”
  • Color tweaks on specific elements — “Make the CTA button outline-only,” “Change the labels to red.”
  • Simple layout adjustments — “Change this 3-column grid to 2 columns,” “Rearrange the order of these elements.”

If your prompt fits one of these patterns and targets a clear element or property, Edit with AI usually handles it well in one or two iterations.

What Edit with AI isn’t designed for

A few things to avoid asking it to do:

  • Adding entirely new content blocks or complex elements — building new cards from scratch, adding components the section doesn’t already have, generating new sections worth of layout
  • Building new sections — describing a section from scratch and asking the AI to generate it
  • Cross-section consistency — applying the same change across multiple sections at once
  • Content rewrites at scale — rewriting all the copy in a section, not just a few labels

Simple layout adjustments like changing a 3-column grid to a 2-column one, or rearranging the order of elements that already exist, usually work fine. The line is roughly: if it’s editing what’s already there, AI can probably handle it. If it’s inventing something new from scratch, you’re better off with Copy Prompt and an AI coding tool that has full creative freedom.

How Edit with AI affects copying

Whatever changes are applied to the section when you click Copy are what gets copied — for Webflow and Figma:

  • Copy to Webflow → the AI-edited section pastes with the changes applied to its classes
  • Copy to Figma → the AI-edited section pastes with the changes applied to its layers

Copy to Framer and Copy Prompt don’t carry AI edits over, for the same reasons covered in Themes:

  • Copy to Framer has technical limitations around pasted style changes
  • Copy Prompt always reflects the original section as it lives in our database

So Edit with AI is most useful when your destination is Webflow or Figma. For Framer or AI coding tools, the edits won’t transfer.

Plan availability

Edit with AI is available on Pro and Ultra plans only. Free users won’t see the wand icon on sections.

There’s a monthly usage limit that resets at the start of each billing period. The exact number is visible in the bottom-left of the Edit with AI panel (e.g., “3/500 edits with AI used · Resets Jun 1”), so you can track your usage as you go.

If you run out of edits before the month resets, theming and the other copy options still work normally — only the AI edits are paused until the next reset.

A note on beta

Edit with AI is in active development. The feature handles a wide range of small edits well today, but you’ll occasionally hit a request it doesn’t quite understand or interprets in an unexpected way. When that happens:

  • Try rephrasing the prompt more specifically — “highlight the first tile with a yellow background” works better than “make one stand out.”
  • Use the Target element picker to point AI at the exact part of the section you want changed
  • If a result is wrong, hit undo and try again — successive attempts often produce better output
  • If something consistently doesn’t work, let us know. Your feedback shapes what we improve next.

Combining Edit with AI with Themes

The two customization features work well together. A typical combo flow:

  1. Apply a Theme to set the section’s overall color palette
  2. Use Edit with AI for the small details — highlighting, accents, rearranging
  3. Copy the result to Webflow or Figma

Both customizations stack and both carry into the Webflow and Figma copies. The result is a section that’s recolored to your brand and tweaked in the specific places you wanted, all done on BYQ before you ever paste into your project.

The BYQ Sections sidebar gives you multiple ways to discover sections, plus deep filters to narrow down to exactly the right one.