Certo, non c’è nulla di nuovo e sorprendete nell’affermare che il colore è uno degli elementi più importanti nella realizzazione di progetti grafici e siti web. L’elemento cromatico infatti influenza direttamente la psicologia dell’utente come abbiamo già avuto modo di sottolineare in altre occasioni su questo blog: la scelta tra due colori e una scelta tra due comunicazioni diverse, con due finalità diverse e con due target diversi. Anche l’uso del gradiente cromatico non è per nulla casuale risponde a determinate logiche comunicative e di marketing. In questo articolo troverete esposti alcuni esempi di gradiente che potete prendere come spunto per i vostri progetti grafici.
Che cosa si intende per gradiente cromatico
Con il termine “gradiente” si indica la differenza tra due condizioni distinte, una di partenza e una di arrivo, che sfumano l’un l’altra senza soluzione di continuità. Questa definizione calza…ehm…”a pennello” quando si parla in particolare di gradiente cromatico, in cui la componente ottica e soggettiva ricopre un ruolo fondamentale. Quando il soggetto percepisce un colore che gradualmente sfuma in un altro si è all’atto pratico un gradiente.
L’uso del gradiente cromatico nell’epoca del digital design
L’uso del gradiente cromatico nel graphic design è molto diffuso e anche assai facile da ottenere grazie a software di elaborazione e produzione grafica come Illustrator e Photoshop. L’avvento del digitale, infatti, ha reso possibile ciò che un tempo era impensabile ottenere se non attraverso il sapiente uso della percezione ottica. Oggi i gradienti cromatici sono ampiamente utilizzati per la realizzazione di progetti di grafica pubblicitaria cartacea e online e ovviamente di siti web di ogni tipo.
Qui di seguito trovate alcuni esempi di gradiente con tanto di codice hex dei due colori “coinvolti”. Sono solo esempi, appunto, di ciò che è possibile fare attravero l’uso sapiente, razionale, ma al tempo stesso creativo dei colori.
#ff9a9e → #fad0c4
#ffecd2 → #fcb69f
#ff9a9e → #fecfef
#a1c4fd → #c2e9fb
#cfd9df → #e2ebf0
#fdfbfb → #ebedee
#f5f7fa → #c3cfe2
#667eea → #764ba2
#fdfcfb → #e2d1c3
#89f7fe → #66a6ff
#48c6ef → #6f86d6
Multiple colors
#feada6 → #f5efef
#a3bded → #6991c7
#13547a → #80d0c7
#93a5cf → #e4efe9
#434343 → #000000
#93a5cf → #e4efe9
