Visual editor

Apasă pe elemente în previzualizare pentru a edita stilurile vizual — fără cod.

Visual editor-ul (Design mode) îți permite să selectezi elemente UI în previzualizarea live și să le ajustezi aspectul. Modificările se scriu automat înapoi în codul sursă.

Activarea design mode

Deschide un proiect în workbench
Comută la modul Design din toolbar-ul chat-ului sau workbench
Apasă pe un element în iframe-ul de previzualizare pentru a-l selecta

Ce poți edita

Proprietate	Exemple
Typography	Dimensiune font, greutate, culoare
Spacing	Padding, margin
Layout	Lățime, aliniere
Colors	Fundal, text, borduri
Effects	Opacitate, border radius

Instrumente pentru imagini

Visual editor-ul include:

Pixabay library — caută și inserează imagini stock
AI image generation — creează imagini din prompturi
Upload — importă și persistă imagini în proiect

Imaginile se salvează în fișierele proiectului și sunt referite în componente.

Cum se aplică modificările

Editările vizuale generează patch-uri care actualizează codul sursă nativ. Previzualizarea se reîmprospătează pentru a reflecta schimbările. Poți edita aceleași proprietăți și în cod ulterior.

Design mode vs. chat

Abordare	Potrivit pentru
Visual editor	Ajustări la nivel de pixel, culori, spațiere pe UI existent
Chat	Ecrane noi, logică, navigație, backend