Fuentes y Colores de Facebook, Twitter, Instagram, Google, Pinterest, etc

Este artículo se actualizó en noviembre de 2019 para reflejar los colores y las fuentes más recientes utilizados por las redes sociales como Facebook, Twitter e Instagram.

Por primera vez, esto no incluye Google Plus, que ahora está extinto. ¿Alguna vez estuvo realmente vivo?

Los Botones de inicio de sesión social, enlaces a canales de redes sociales: en 2019, esto sigue siendo algo importante en el diseño web y el diseño de aplicaciones.

Quiero decir, ¿qué negocio no está en las redes sociales en estos días?

Tener una colección de activos de marca utiliza redes sociales, para que podamos incorporarlos en nuestros propios diseños, es bastante útil.

Es algo que buscamos en Google cada vez que creamos una aplicación o sitio web

❓¿Cuál es el color utilizado por Facebook?

❓¿Cuál es el código de color de Facebook?

o simplemente, Facebook azul. De hecho, ¡apuesto a que es así como encontraste este artículo!

Bueno, no te haré esperar. Echemos un vistazo a los colores y fuentes utilizados por Facebook , Twitter , Pinterest , Instagram , Snapchat , LinkedIn , Facebook Messenger , YouTube y Google Material Design.

🏅Colores principales de Facebook, Twitter, Instagram, YouTube, Pinterest

✅Facebook

Fuentes y colores utilizados por Facebook

Códigos de color “Facebook Blue”

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

Fuentes de Facebook

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

Facebook usa la fuente Segoe UI para la versión de Windows de su sitio web de escritorio y la fuente San Francisco hecha por Apple para la versión macOS (ambas son la fuente predeterminada del sistema).

Para iOS y Android, son San Francisco y Roboto respectivamente (una vez más, ambas fuentes del sistema, por facilidad de lectura y familiaridad. Estas fuentes se están convirtiendo en un estándar.

✅Twitter

Fuentes y colores utilizados por Twitter

Códigos de color de Twitter

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

Combinado con variantes de “Twitter Grey” (que contiene una mezcla de tonos azules, negros y blancos), Twitter blue (# 38A1F3) se utiliza como el color principal de la marca.
Fuentes de Twitter

Windows: Helvética
macOS: Helvetica Neue
iOS: San Francisco
Android: Roboto

Si bien Twitter también ha predeterminado las fuentes del sistema para sus aplicaciones móviles (como lo hacen la mayoría de las redes sociales), la versión de Windows del sitio web utiliza Helvetica y la versión de MacOS Helvetica Neue, algo desactualizada, pero estoy seguro de que tienen sus razones.

✅Pinterest

Fuentes y colores utilizados por Pinterest

Códigos de color de Pinterest

Hex: # BD081C
RGB: 189,8,28

¡El clásico color rojo de Pinterest nunca ha cambiado!

Fuentes de Pinterest

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

Dato curioso: mientras Pinterest usa aproximadamente las mismas fuentes que son estándar con otras redes sociales, Pinterest usa la fuente Hiragino para japonés y otros idiomas orientales, que se lee mejor en comparación con las fuentes usadas con idiomas romanos.

✅Instagram

Fuentes y colores utilizados por Instagram

Códigos de color “gris de Instagram”

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

Instagram también usa una combinación de diferentes gradientes.

Para ser honesto, es raro ver estos colores en la naturaleza: aquellos que hacen referencia a sus canales de redes sociales tienden a usar “Instagram Grey”.

Fuentes de Instagram

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

Nada fuera de lo común aquí. Como puedes, Segoe UI, San Francisco y Roboto se están convirtiendo en un estándar con las redes sociales, ya que Instagram no es diferente.

✅Snapchat

Fuentes y colores utilizados por Snapchat

Códigos de color de Snapchat

Hex: # FFFC00
RGB: 255,252,0

Fuentes de Snapchat

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

Por extraño que parezca, la fuente utilizada en la versión web de Snapchat es un poco diferente a la mayoría, ya que la mayoría tiende a volver a la fuente del sistema. Snapchat, sin embargo, usa Avenir Next.

✅Facebook Messenger

Fuentes y colores utilizados por Facebook Messenger

Códigos de color de Facebook Messenger

Aunque es una aplicación de Facebook, el azul utilizado por Messenger es ligeramente diferente:

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

Y el logotipo también usa infusiones de este color:

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

Fuentes de Facebook Messenger

Messenger usa el mismo conjunto de fuentes que Facebook:

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

✅Youtube

Códigos de color de YouTube

Hex: # ED3833
RGB: 237,56,51

Fuentes de YouTube

YouTube, propiedad de Google, usa solo Roboto.

Sí, eso es correcto. Todas las aplicaciones de Google y muchas aplicaciones de Android de terceros (por familiaridad y coherencia) utilizan el sistema de diseño de Google conocido como Material Design System.

El diseño del material contiene un sistema de color de colores aceptables (no obligatorio, pero sí recomendado) y la fuente predeterminada de Google, ampliamente reconocida, Roboto.

¡Haz clic para puntuar esta entrada!
(Votos: 1 Promedio: 5)