Skip to content
· New Feature AI

Visual Edits in AI Studio

Visual Edits is a new in-canvas editing mode in SMBcrm AI Studio that lets you change how your site looks by selecting elements directly in the live preview.

S
SMBcrm Team · May 7, 2026

Visual Edits is a new in-canvas editing mode in SMBcrm AI Studio. It lets you change how your site looks by selecting elements directly in the live preview, including colors, fonts, spacing, images, icons, and text.

For teams using SMBcrm’s AI features, this gives you a faster way to make precise visual updates without describing every change in a prompt.

Visual Edits panel in AI Studio

What Changed

Click to select

Click any element in the preview to open the Visual Edits panel. The available controls adapt based on what you select, such as text, buttons, images, icons, or layout elements.

Edit text inline

Double-click any text element to edit it directly in the preview. Press Escape or click outside the element when you are done.

Inline text editing in Visual Edits

Swap icons faster

Click any Lucide icon to open a searchable library of more than 1,600 icons. Choose a replacement and it swaps instantly without a reload.

Use live color controls

Your project’s theme colors appear alongside the full Tailwind palette. Click a color swatch to apply it to the selected element.

Color controls in Visual Edits

Adjust spacing and layout

Margin and padding controls are shown side by side, with a toggle to link or unlink all four sides. For images, a Layout dropdown lets you choose Fill, Contain, Cover, or Scale down.

Spacing controls in Visual Edits

Resize icons

Select a Lucide icon to adjust width and height. Values can snap to Tailwind classes or use custom sizes.

Apply changes across multiple elements

Select multiple elements at once and describe the change you want across all of them in a single prompt. This is useful for applying consistent styling or coordinated updates across several components.

Multi-select editing in Visual Edits

Direct Edits Do Not Use AI Model Calls

Color changes, spacing tweaks, icon swaps, and inline text edits apply instantly without calling the AI model. These direct edits do not count against token usage. The AI model is only used when you explicitly send a prompt.

Save or Discard Changes

Changes are previewed live. Select Save to apply them to your code, or Discard to throw them away.

What You Can Edit

  • Any element: colors, spacing, border, shadow, border radius, opacity, and typography
  • Text: inline content
  • Buttons and inputs: type and aria label
  • Links: URL, target, and rel
  • Images: source, alt text, and object-fit
  • Lucide icons: icon selection and sizing
  • Textareas: placeholder, name, and rows

In Case You Missed It

You may also want to read AI Studio Deleted Projects Are Now Marked Inactive.

Release Images

AI Studio message composer with the Visual edits control


Need Help Applying This Update?

Want help turning this update into a working part of your CRM, marketing, or automation setup?

Get Started or schedule a demo and we’ll help you map the right next step.

Tags New Feature AI
Share
60-day money-back guarantee

See what's new in SMBcrm.

Every release adds more ways to capture leads, automate work, and grow. Plans start at $97 a month.

60-day money-back guarantee

Eligible Startup and Professional initial subscription fees only. Usage and add-ons are excluded. Read the refund terms.

No setup fees

Plan your setup with training and support

Cancel anytime

No long-term contracts, stay because you want to