Gestione icone QV Legs

Da qualiwiki.
Versione del 26 giu 2026 alle 16:40 di Qualivision (discussione | contributi) (Creata pagina con "thumb|right|300px|Impostazioni consigliate su Google Fonts thumb|right|300px|Esempio di icona selezionata Questa pagina descrive come cercare, aggiungere ed esportare nuove icone da utilizzare all'interno del '''QVLegs''', mantenendo uno stile coerente con le icone già presenti nel progetto. Per cercare nuove icone andare su '''Google Fonts''', nella sezione '''Icons'''. Per mantenere la coerenza grafica con le icone già utili...")
(diff) ← Versione meno recente | Versione attuale (diff) | Versione più recente → (diff)
Vai alla navigazione Vai alla ricerca
Impostazioni consigliate su Google Fonts
Esempio di icona selezionata

Questa pagina descrive come cercare, aggiungere ed esportare nuove icone da utilizzare all'interno del QVLegs, mantenendo uno stile coerente con le icone già presenti nel progetto.

Per cercare nuove icone andare su Google Fonts, nella sezione Icons.

Per mantenere la coerenza grafica con le icone già utilizzate, impostare la ricerca come mostrato nelle immagini a destra. Le impostazioni sono importanti perché permettono di avere icone uniformi per dimensione, colore, spessore e stile.

Le impostazioni principali da mantenere sono:

  • Stile: Material Symbols Outlined
  • Dimensione: 48 px
  • Colore: #065489
  • Peso: 400
  • Grade: 0
  • Optical size: 48
  • Fill: facoltativo, da valutare in base all'icona scelta

Il riempimento dell'icona non è obbligatorio: può essere attivato o lasciato disattivato a seconda del tipo di icona e del risultato visivo finale. L'obiettivo è scegliere sempre la variante più coerente con il set già presente.

In alternativa è possibile usare direttamente il seguente link, che contiene già le impostazioni preimpostate:

https://fonts.google.com/icons?icon.size=48&icon.color=%23065489&icon.platform=web&selected=Material+Symbols+Outlined:pie_chart:FILL@0;wght@400;GRAD@0;opsz@48


Una volta individuata l'icona più adatta, selezionarla su Google Fonts. Nel pannello laterale destro usare l'opzione Copia.

Successivamente aprire Figma. L'accesso è già salvato nel browser QV.

Incollare la nuova icona in Figma insieme alle altre icone già presenti. È importante inserirla nello stesso file o nello stesso gruppo delle altre, così da mantenere sempre un set completo, ordinato e aggiornato.

Dopo aver incollato l'icona, controllare che sia coerente con quelle già utilizzate nel progetto.

Se l'icona non risulta perfettamente coerente, è possibile modificarla direttamente in Figma oppure scegliere una variante più adatta da Google Fonts.


Quando l'icona risulta corretta e coerente con le altre, esportarla da Figma in formato PNG.