Guida allo stile

Una guida centrale per i componenti comuni dell'interfaccia.
Colori
Una tavolozza convenientemente preparata per regolare facilmente tutti i colori.
Primaria 1
Primaria 2
Primaria 3
Grigio 1
Grigio 2
Grigio 3
Grigio 4
Bianco
Il successo
Avvertenze
Pericolo
Tipografia
Titoli, corpo e altri elementi di testo comuni.

Display Uno

Display due

Titolo 1

Intestazione grande

Rubrica 2

Intestazione media

Rubrica 3

Rubrica 4

Rubrica 5
Rubrica 6
Testo grande Collegamento grande 
Testo del corpo Link del corpo
Testo piccolo Collegamento piccolo
Testo minuscolo Collegamento minuscolo
Collegamento con freccia
Elemento di testo ricco
Formattazione degli elementi tipografici all'interno dell'elemento Rich Text.

Rubrica 2

L'elemento rich text consente di creare e formattare titoli, paragrafi, virgolette, immagini e video in un unico punto, invece di doverli aggiungere e formattare singolarmente. Basta un doppio clic per creare facilmente contenuti.

Ecco una citazione a blocchi

Rubrica 4

I titoli, i paragrafi, le citazioni a blocchi, le figure, le immagini e le didascalie delle figure possono essere stilizzati dopo l'aggiunta di una classe all'elemento di testo ricco, utilizzando il sistema di selettori annidati "When inside of". Qui c'è del testo in grassetto e qui c'è del testo in corsivo.

Ecco la didascalia di una figura.
  • Elenco puntato Voce 1
  • Elenco puntato Voce 2
  • Elenco puntato Voce 3
  1. Voce numerata 1
  2. Voce numerata 2
  3. Voce numerata 3
Icone - Interfaccia
Iconografia comune dell'interfaccia
Icone - Sociale
Icone comuni dei social network
Pulsanti
Variazione dei componenti, dello stile e delle dimensioni del testo.
Dimensioni dei pulsanti
Pulsante rotondo
Pulsante icona
Ingressi del modulo
Variazioni di dimensione e di stato per gli input di testo.
Dimensioni di ingresso
Grazie! La tua presentazione è stata ricevuta!
Ops! Qualcosa è andato storto durante l'invio del modulo.
Testi
Grazie! La tua presentazione è stata ricevuta!
Ops! Qualcosa è andato storto durante l'invio del modulo.
Ingresso con icona
Grazie! La tua presentazione è stata ricevuta!
Ops! Qualcosa è andato storto durante l'invio del modulo.
Ingresso etichettato
Etichetta
* Testo di suggerimento in ingresso
Grazie! La tua presentazione è stata ricevuta!
Ops! Qualcosa è andato storto durante l'invio del modulo.
Selezionabili del modulo
Caselle di controllo, radio e selezioni.
Caselle di controllo
Grazie! La tua presentazione è stata ricevuta!
Ops! Qualcosa è andato storto durante l'invio del modulo.
Radio
Grazie! La tua presentazione è stata ricevuta!
Ops! Qualcosa è andato storto durante l'invio del modulo.
Seleziona
Grazie! La tua presentazione è stata ricevuta!
Ops! Qualcosa è andato storto durante l'invio del modulo.
Interruttori
Grazie! La tua presentazione è stata ricevuta!
Ops! Qualcosa è andato storto durante l'invio del modulo.
Schede
Stili multipli per la visualizzazione dei contenuti a schede.
Scheda 1 Contenuto
Scheda 2 Contenuto
Scheda 3 Contenuto
Scheda 1 Contenuto
Scheda 2 Contenuto
Scheda 3 Contenuto
Scheda 1 Contenuto
Scheda 2 Contenuto
Scheda 3 Contenuto
Scheda 1 Contenuto
Scheda 2 Contenuto
Scheda 3 Contenuto
Distintivi
Combinare con altri componenti per visualizzare i metadati.
Primaria 1
Primaria 2
Primaria 3
Grigio 1
Grigio 2
Grigio 3
Grigio 4
Il successo
Avvertenze
Pericolo
Avatar
Rappresentare gli utenti sull'interfaccia.
Dimensioni dell'avatar
Piccolo
Standard
Grande
Ombre
Stili preimpostati per dare profondità ai componenti dell'interfaccia.
Piccolo
Standard
Grande
Contenuto in scatola
Componente strutturale per la visualizzazione di contenuti con padding e bordo.
Intestazione
Si tratta di un testo all'interno di un blocco div.
Intestazione

Si tratta di un testo all'interno di un blocco div.

Pulsante
Icone
Disposizioni di componenti che includono icone.
Titolo del contenuto
Volutpat egestas nibh rhoncus mauris semper. Quam nec consectetur est sed lobortis orci ridiculus.
Titolo del contenuto
Volutpat egestas nibh rhoncus mauris semper. Quam nec consectetur est sed lobortis orci ridiculus.

Attirate l'attenzione con questo breve titolo.

Volutpat egestas nibh rhoncus mauris semper. Quam nec consectetur est sed lobortis orci ridiculus.
Icona Titolo Orizzontale
Titolo del contenuto
Bolutpat egestas nibh rhoncus mauris semper. Quam nec consectetur est sed lobortis orci ridiculus.
Collegamenti
Componenti multiuso per il collegamento ad altre pagine.
Titolo del link
Elenchi
Elenchi preparati in modo pratico e in diversi stili.
Architettura modulare
Estetica visiva pulita e curata
Assistenza clienti amichevole
Architettura modulare
Estetica visiva pulita e curata
Assistenza clienti amichevole
Architettura modulare
Estetica visiva pulita e curata
Assistenza clienti amichevole
Architettura modulare
Estetica visiva pulita e curata
Assistenza clienti amichevole

Cerca