Tipografía - Oxygenados La comunidad
Oxygenados La comunidad hispana
Recoda White Full Logo
Patrocinador
Menu
post oxygen builder

Tipografía

Tipografía
21 de julio de 2021
Oxigenados Tip del dia

Controla el aspecto de tu texto con los ajustes dentro de Advanced > Typography.

Font Family

Este ajuste especifica la fuente de un elemento/texto.

Por defecto, Oxygen te permite elegir entre más de 800 fuentes de Google Fonts. Como hay tantas fuentes en Google Fonts, mostrarlas todas a la vez en la lista no sería práctico. Para utilizar una fuente de la biblioteca de Google, haga clic en el menú desplegable Familia de Fuentes, y luego comience a escribir el nombre de la fuente.

Lee el artículo Global Fonts para obtener información sobre cómo añadir cualquier fuente personalizada o vincular Oxygen a Typekit.

Font Size

Establece el tamaño del texto.

Color

Establece el color del texto.

Font Weight

Establece la negrita, también conocida como peso. Un peso de 700 es negrita, y 400 es normal.

Text Align

Establece la alineación del texto.

  • Left – Alinea el texto a la izquierda.
  • Right – Alinea el texto a la derecha.
  • Center – Centra el texto.
  • Justify – Estira las líneas para que cada línea tenga el mismo ancho (como los periódicos y revistas).

Line Height

Sets the amount of vertical space used by a line of text.

Oxygen recomienda utilizar una altura de línea sin unidades, es decir, sólo un número, sin px o em o %.

Cuando se utiliza una altura de línea sin unidades, el navegador la multiplica automáticamente por el tamaño de la fuente para calcular una altura de línea final. Por ejemplo, una altura de línea de 1,5 y un tamaño de fuente de 14px daría como resultado líneas con alturas de 21px.

Si quieres utilizar una unidad, sólo tienes que escribirla después del número, es decir, "21px".

Letter Spacing

Este ajuste aumenta o disminuye el espacio entre los caracteres del texto.

Text Decoration

  • none – Valor por defecto.
  • underline – El texto será subrayado.
  • overline – El texto se sobrelínea (subrayado superior).
  • line-through – Se mostrará una línea a través del texto.

Font Style

  • normal – Valor por defecto.
  • italic – El texto aparecerá en cursiva.

Text Transform

Este ajuste permite la capitalización automática del texto.

  • none – No hay mayúsculas. El texto se representa tal cual. Se utiliza por defecto.
  • capitalize – Transforma el primer carácter de cada palabra en mayúsculas.
  • uppercase – Transforma todos los caracteres en mayúsculas.
  • lowercase – Transforma todos los caracteres a minúsculas.

Font Smoothing

Esta opción controla la aplicación del antialiasing cuando se renderizan las fuentes. Hay tres opciones disponibles:

  • initial – Se utiliza por defecto. En este modo, el navegador decide cuándo utilizar el antialiasing de subpíxeles.
  • antialiased – Suaviza la fuente a nivel de píxel, en contraposición al subpíxel. El cambio del renderizado de subpíxeles al antialiasing para textos claros sobre fondos oscuros hace que se vean más claros.
  • subpixel-antialiased – En la mayoría de las pantallas que no son retina, esto dará el texto más nítido.

Recuerda los siguientes consejos cuando cambies el suavizado de la fuente:

  • cuando coloques texto claro sobre un fondo oscuro, cambia el suavizado de la fuente a antialiasing.
  • cuando coloques texto oscuro sobre un fondo claro, deja el suavizado de la fuente como está.

Recomendación: no utilices esta configuración hasta que leas este excelente artículo sobre el suavizado de fuentes: http://usabilitypost.com/2012/11/05/stop-fixing-font-smoothing/

 

Última modificación: 20 de junio de 2020

VOLVER AL LISTADO COMPLETO