Hit enter to search or ESC to close
studio jemstudio jemstudio jem
  • No menu assigned
studio jem
Caratteri e colori utilizzati da Facebook, Twitter, Instagram + altri
Design GraficoDesign-Ux

Caratteri e colori utilizzati da Facebook, Twitter, Instagram + altri

by STUDIO JEMMarzo 20, 2019Maggio 3rd, 2020No Comments

Avere una collezione di risorse di marca utilizzate social network, in modo che possiamo incorporarle nei nostri progetti, ? abbastanza utile.

? qualcosa che cerchiamo su Google ogni volta quando sviluppiamo un’app o un sito Web (qual ? il colore utilizzato da Facebook ?, Qual ? il codice colore di Facebook ?, o semplicemente, Facebook blu)

Beh, non ti far? aspettare. Diamo un’occhiata ai colori e ai caratteri utilizzati da Facebook, Twitter, Pinterest, Instagram, Snapchat, LinkedIn, Facebook Messenger, YouTube e Google Material Design.

Mostrami solo i colori principali (Facebook, Twitter, Instagram, YouTube, Pinterest).

  • Facebook
    • Facebook Blu Codici Colore
    • Font Facebook
  • Twitter
    • Twitter Codici Colore
    • Font Twitter
  • Pinterest
    • Pinterest Codici Colore
    • Font Pinterest
  • Instagram
    • Instagram Grey Codici Colore
    • Font Instagram
  • Snapchat
    • Snapchat Codici Colore
    • Font Snapchat
  • Facebook Messenger
    • Facebook Messenger Codici Colore
    • Facebook Messenger Font
  • LinkedIn
    • LinkedIn Codici Colore
    • LinkedIn Font
  • YouTube
    • YouTube Codici Colore
    • YouTube Font
  • Bonus: Google Material Design

Facebook

colore e font facebook, blue facebook, facebook blu, facebook font

Facebook Blu Codici Colore

  • Hex: #4267b2
  • RGB: 66,103,178

Font Facebook

  • Windows: Segoe UI
  • macOS: San Francisco
  • iOS: San Francisco
  • Android: Roboto

Facebook utilizza il font Segoe UI per la versione Windows del proprio sito Web desktop e il font San Francisco creato da Apple per la versione macOS (entrambi sono i font di sistema predefiniti).

Per iOS e Android, sono rispettivamente San Francisco e Roboto (ancora, entrambi i font di sistema, per la leggibilit? e la familiarit?), che stanno diventando uno standard.

Twitter

Twitter Codici Colore

  • Hex: #38A1F3
  • RGB: 56,161,243

Combinato con le varianti di “Twitter Grey” (che contiene un mix di tonalit? blu, nero e bianco), Twitter blu (#38A1F3) viene utilizzato come colore principale del marchio.

Font Twitter

  • Windows: Helvetica
  • macOS: Helvetica Neue
  • iOS: San Francisco
  • Android: Roboto

Mentre Twitter ha anche impostato automaticamente i font di sistema per le loro app mobili (come la maggior parte dei social network), la versione Windows del sito web utilizza Helvetica e la versione macOS Helvetica Neue – un po ‘obsoleta ma siamo sicuri che abbiano le loro ragioni.

Pinterest

pinterest font, codice colore pinterest, colore pinterest

Pinterest Codici Colore

  • Hex: #BD081C
  • RGB: 189,8,28

Il classico colore rosso di Pinterest non ? mai cambiato!

Font Pinterest

  • Windows: Segoe UI
  • macOS: San Francisco
  • iOS: San Francisco
  • Android: Roboto

Mentre Pinterest utilizza all’incirca gli stessi caratteri standard degli altri social network, Pinterest usa il font Hiragino per il giapponese e altre lingue orientali, che si legge meglio rispetto ai caratteri usati con le lingue romane. Sapevi?

Instagram

font instragram, colore instagram, icon instragram

Instagram Grey Codici Colore

  • Hex: #231F20
  • RGB: 35,31,32

Instagram usa anche una combinazione di diversi gradienti. ? difficile capire quali sono i singoli colori e in quale scenario dovrebbero essere utilizzati, ma qui puoi trovare tutti gli asset del brand di Instagram. Per essere onesti, ? raro vedere questi colori in natura – quelli che fanno riferimento ai loro canali di social media tendono a utilizzare “Instagram Gray”.

Font Instagram

  • Windows: Segoe UI
  • macOS: San Francisco
  • iOS: San Francisco
  • Android: Roboto

Niente di straordinario qui. Come vedi, Segoe UI, San Francisco e Roboto sono diventati uno standard dei social network, con Instagram? non c’? diverso. 🙂

Snapchat

Snapchat Codici Colore

  • Hex: #FFFC00
  • RGB: 255,252,0

Font Snapchat

  • Windows: Avenir Next
  • macOS: Avenir Next
  • iOS: San Francisco
  • Android: Roboto

Stranamente, il font utilizzato nella versione web di Snapchat ? un po ‘diverso dalla maggior parte, poich? la maggior parte tende a tornare al font di sistema. Il logo Snapchat, tuttavia, utilizza Avenir Next.

Facebook Messenger

colore facebook messenger, font facebook messenger

Facebook Messenger Codici Colore

Sebbene sia un’app Facebook, il blu utilizzato da Messenger ? leggermente diverso:

  • Hex: #0084FF
  • RGB: 0,132,255

E il logo usa anche questo colore:

  • Hex: #00C6FF
  • RGB: 0,198,255

Facebook Messenger Font

Messenger utilizza lo stesso set di caratteri di Facebook:

  • Windows: Segoe UI
  • macOS: San Francisco
  • iOS: San Francisco
  • Android: Roboto

LinkedIn

LinkedIn Codici Colore

  • Hex: #0077B5
  • RGB: 0,119,181

LinkedIn Font

LinkedIn usa Source Sans in esclusiva (con Arial come backup), in particolare con i pesi tra luce e semi-grassetto. Leggi le linee guida sui marchi di Linkedin qui.

Nota: Source Sans non ha uno stile corsivo, quindi sub per Georgia. Lo so, strano!

YouTube

YouTube Codici Colore

  • Hex: #ED3833
  • RGB: 237,56,51

YouTube Font

YouTube, propriet? di Google, utilizza solo Roboto.

Bonus: Google Material Design

S?, ? vero. Tutte le app Google e molte app Android di terze parti (per familiarit? e coerenza) utilizzano il sistema di progettazione Google noto come Material Design System.

Il design del materiale contiene un sistema di colori, di colori accettabili (non richiesto ma consigliato) e il carattere predefinito e ampiamente riconosciuto di Google, Roboto.

Tags:

BrandingDesign GraficoGraficaLogotipografia
Love0 Share Tweet Share Pin

web agency.studio jem.web design.studio grafico
© 2018-2021 p.iva IT03883630927 privacy.

  • home
  • portfolio
  • preventivo
  • • web agency
  • • siti web
  • • e-commerce
  • • grafica
  • • contatti

• blog

  • Tendenze creative nel design del logo per il 2021
  • Tendenze innovative del web design nel 2021

studio jem. © 2018-2021