Skip to main content

When to use

Use Design Mode for quick visual tweaks: colors, spacing, typography, and effects. Use AI chat for larger structural changes.

How it works

1

Select a component

Click on the component you want to edit
2

Enter Design Mode

Press D or open the Design tab
3

Inspect elements

Click elements in the preview to inspect them
4

Adjust styles

Use the controls to modify:
  • Colors & backgrounds
  • Typography
  • Spacing (padding & margins)
  • Effects (borders & shadows)
5

Save changes

Save your changes when done

Best practices

Save regularly — Don’t lose your tweaks!
Make small adjustments — Iterate incrementally for best results.