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
Select a component
Click on the component you want to edit
Enter Design Mode
Press D or open the Design tab
Inspect elements
Click elements in the preview to inspect them
Adjust styles
Use the controls to modify:
- Colors & backgrounds
- Typography
- Spacing (padding & margins)
- Effects (borders & shadows)
Save changes
Save your changes when done
Best practices
Save regularly — Don’t lose your tweaks!
Make small adjustments — Iterate incrementally for best results.
