Icone
Le icone rappresentano una comunicazione visiva immediata aiutando l’utente a orientarsi e semplificando i contenuti presentati. Le icone che utilizziamo non devono essere solo decorative ma funzionali, chiare, riconoscibili e allineate al tono visivo di Betacom.
Libreria icone
Iconsax
Iconsax è una libreria di icone versatile e moderna, progettata per adattarsi perfettamente a diversi usi e tool come Vue.js, Vuesax, React, Svelte, Flutter, Web Component,TypeScript, JavaScript, Figma.
Variabili di stile
La libreria offre più stili per ogni icona permettendo varietà e coerenza visiva tra interfacce, social, presentazioni e materiali aziendali.
Outline
Twotone
Bulk
Broken
Bold
Spessore e dimensione
Le icone devono avere una dimensione costante: nei contesti web 24x24px è la dimensione standard, ma a seconda degli utilizzi prevediamo l’utilizzo di dimensioni scalate su 8px:
•minime 16px,
•max 56px.
In base alla scala anche lo spessore dell’icona deve seguire una proporzione da:
•minimo 1 px,
•max 3 px.
16 px
1 pt
24 px
1,2 px
32 px
1,5 px
32 px
2 px
48 px
2,5 px
56 px
3 px
Spaziatura
Le icone come ogni altro elemento nella comunicazione necessita di spazi sufficienti per una corretta leggibilità. In base alla dimensione si consiglia di avere dei padding di min 4 px tra un icona e un testo e dei margin di min 8 px intorno a testo e icona.
Esempi di utilizzo
Libreria icone
Iconsax
Iconsax è una libreria di icone versatile e moderna, progettata per adattarsi perfettamente a diversi usi e tool come Vue.js, Vuesax, React, Svelte, Flutter, Web Component,TypeScript, JavaScript, Figma.
Variabili di stile
La libreria offre più stili per ogni icona permettendo varietà e coerenza visiva tra interfacce, social, presentazioni e materiali aziendali.
Outline
Twotone
Bulk
Broken
Bold
Spessore e dimensione
Le icone devono avere una dimensione costante: nei contesti web 24x24px è la dimensione standard, ma a seconda degli utilizzi prevediamo l’utilizzo di dimensioni scalate su 8px:
•minime 16px,
•max 56px.
In base alla scala anche lo spessore dell’icona deve seguire una proporzione da:
•minimo 1 px,
•max 3 px.
16 px
1 pt
24 px
1,2 px
32 px
1,5 px
32 px
2 px
48 px
2,5 px
56 px
3 px
Spaziatura
Le icone come ogni altro elemento nella comunicazione necessita di spazi sufficienti per una corretta leggibilità. In base alla dimensione si consiglia di avere dei padding di min 4 px tra un icona e un testo e dei margin di min 8 px intorno a testo e icona.
Esempi di utilizzo
Libreria icone
Iconsax
Iconsax è una libreria di icone versatile e moderna, progettata per adattarsi perfettamente a diversi usi e tool come Vue.js, Vuesax, React, Svelte, Flutter, Web Component,TypeScript, JavaScript, Figma.
Variabili di stile
La libreria offre più stili per ogni icona permettendo varietà e coerenza visiva tra interfacce, social, presentazioni e materiali aziendali.
Outline
Twotone
Bulk
Broken
Bold
Spessore e dimensione
Le icone devono avere una dimensione costante: nei contesti web 24x24px è la dimensione standard, ma a seconda degli utilizzi prevediamo l’utilizzo di dimensioni scalate su 8px:
•minime 16px,
•max 56px.
In base alla scala anche lo spessore dell’icona deve seguire una proporzione da:
•minimo 1 px,
•max 3 px.
16 px
1 pt
24 px
1,2 px
32 px
1,5 px
32 px
2 px
48 px
2,5 px
56 px
3 px
Spaziatura
Le icone come ogni altro elemento nella comunicazione necessita di spazi sufficienti per una corretta leggibilità. In base alla dimensione si consiglia di avere dei padding di min 4 px tra un icona e un testo e dei margin di min 8 px intorno a testo e icona.
Esempi di utilizzo
Icone
Nella cartella troverai una selezione di icone divise per formato della libreria Iconsax.
Brand kit
Cerchi tutto in un unico file?