> ## Documentation Index
> Fetch the complete documentation index at: https://lovable.generaltranslation.app/llms.txt
> Use this file to discover all available pages before exploring further.

# Personalizza i progetti con gli strumenti di design

> Usa gli strumenti di design per applicare e personalizzare temi, modificare gli elementi dell'interfaccia utente e mantenere un brand coerente in tutto il tuo progetto.

Gli **strumenti di design** mettono insieme tutto ciò di cui hai bisogno per personalizzare visivamente il tuo progetto — dai temi di alto livello alle modifiche visive più dettagliate. Puoi gestire l'aspetto generale del tuo progetto tramite **Themes** oppure apportare modifiche rapide e mirate usando **Visual edits**, senza scrivere codice né utilizzare crediti.

Per accedere agli strumenti di design, vai a **Design view** tramite il pulsante `+` accanto ad Anteprima.

<img src="https://mintcdn.com/generaltranslation-d8a08cd1/At48MABj-G93zw7Y/images/changelog-design-view-11-26-25.png?fit=max&auto=format&n=At48MABj-G93zw7Y&q=85&s=08a6483a1839b8ed34bfb420913293df" alt="Changelog Design View 11 26 25 Pn" width="937" height="277" data-path="images/changelog-design-view-11-26-25.png" />

<div id="why-use-design-tools">
  ## Perché usare gli strumenti di design
</div>

Gli strumenti di design permettono a tutti — designer, professionisti del marketing e membri del team non tecnici — di apportare modifiche al design in modo visivo, mantenere la coerenza con il brand e lavorare più velocemente.

<div id="key-benefits">
  ### Vantaggi principali
</div>

* **Branding coerente:** Applica temi condivisi che riflettono l’identità del tuo brand
* **Iterazione più rapida:** Aggiorna layout e testi visivamente, senza bisogno di codice o prompt
* **Modifica accessibile:** Gli utenti non tecnici possono apportare modifiche di design in tutta sicurezza
* **Anteprima in tempo reale**: Visualizza ogni modifica grafica in tempo reale prima della pubblicazione

<div id="common-use-cases">
  ### Casi d'uso comuni
</div>

* Designer che mantengono la coerenza del brand su più Progetti
* Marketer che lanciano nuove pagine di campagna senza discostarsi dalle linee guida del brand
* Product manager che perfezionano direttamente layout e testi
* Team che realizzano rapidamente prototipi e varianti con stili visivi condivisi

<div id="themes">
  ## Temi
</div>

I **temi** definiscono il sistema di stile principale del tuo Progetto — colori, font, spaziature e raggio dei bordi — e costituiscono le fondamenta dell’identità del tuo brand.

<div id="key-capabilities">
  ### Funzionalità principali
</div>

* **Applica:** Scegli tra i template Lovable integrati oppure applica un tema personalizzato
* **Crea:** Genera un tema dal tuo progetto attuale
* **Importa:** Carica un file CSS personalizzato (come `index.css` o `globals.css`) per trasformarlo in un tema
* **Personalizza:** Modifica colori, tipografia e spaziatura direttamente nella UI
* **Condividi:** I temi sono disponibili per tutti i membri della tua area di lavoro
* **Anteprima:** Prova le modifiche in tempo reale prima di applicarle

<div id="visual-editing">
  ## Modifica visiva
</div>

La modalità **Modifica visiva** ti permette di modificare il tuo Progetto direttamente sulla pagina, in modo visivo. È pensata per apportare modifiche rapide e intuitive, mantenendo il pieno controllo sul layout e sulle spaziature.

<div id="key-capabilities">
  ### Funzionalità principali
</div>

* **Seleziona più elementi** per modifiche in blocco tenendo premuto `⌘ Command` (Mac) o `⊞ Win` (Windows).
* **Controlli di layout** per allineamento e posizionamento
* **Regola margini e padding** sui singoli lati dei contenitori
* **Modifica testo, colori e font** direttamente dalla barra laterale
* **Formattazione avanzata del testo** con interruzioni di riga e stili in linea
* **Sostituisci le immagini** caricando file o aggiungendo URL di immagini
* **Genera immagini con l'AI** modificandole tramite prompt

<div id="quick-start">
  ## Guida rapida
</div>

1. Apri la **Design view** dal pulsante `+` accanto ad Anteprima.
2. Passa dalle schede **Themes** e **Visual edit** per lavorare al design del tuo progetto nel pannello di sinistra.

   * Vai a **Themes** per selezionare un tema o crearne uno tuo e applicarlo al progetto.
   * Vai a **Visual edits** per selezionare elementi nell’anteprima in tempo reale e modificarli visivamente.

   <Tip>
     Per accedere rapidamente alle modifiche visive, usa la scorciatoia **Visual edits** nella casella dell’istruzione.
   </Tip>
3. **Visualizza l’anteprima e salva** quando sei soddisfatto del risultato.

<Warning>
  Personalizzare visivamente il tuo progetto non consuma crediti, tranne nei casi seguenti:

  * Apporti modifiche a elementi dinamici.
  * Chiedi al Lovable Agent di modificare il design. Usa invece gli strumenti di design.
</Warning>