Cómo aplicar estilos a un texto

Personaliza el texto de tu sitio usando una variedad de configuraciones.

Última actualización: 20 de diciembre de 2024

Puedes aplicar estilo a la fuente, el color, el tamaño, el espaciado y más de un texto en los estilos de sitio. El estilo controla la tipografía (diseño de fuentes), dando a las palabras personalidad y estilo. La mayoría de los cambios de estilo aplican a ese tipo de texto en todo el sitio.

Esta guía revisa las diferentes formas de darle estilo al texto de tu sitio.

Consejo

para obtener más información sobre el formato del texto, como la configuración del tipo de texto, la creación de listas, y las negritas y cursivas, consulta Cambiar el formato de un texto.

Mira el video

Ajustar el estilo del texto

El estilo del texto del sitio depende de la versión del sitio.

Para aplicar estilo al texto, usa los paneles de fuentes y colores en los estilos del sitio para establecer fuentes y colores para todo el sitio, o personaliza las fuentes y colores en secciones específicas.

Para obtener más información, visita Cómo cambiar fuentes y Cómo cambiar colores.

Para aplicar estilo al texto, utiliza estilos del sitio para elegir las fuentes y los colores del texto. Para ayudarte a lograr un aspecto coherente, los ajustes de estilos del sitio se aplican a todo el texto con un formato específico.

Por ejemplo, puedes cambiar la fuente de todos los encabezados al mismo tiempo o todos los cuerpos del texto a la vez. Cada plantilla tiene opciones levemente diferentes de estilo. Infórmate mejor sobre el funcionamiento en Cómo cambiar las fuentes.

Usa las siguientes secciones para ver los pasos específicos de cada opción de estilo.

Color

La forma en la que cambies el color del texto depende de la versión de tu sitio.

Puedes cambiar el color de todo un grupo de texto en los estilos del sitio, como Párrafo (pequeño) o Enlaces de encabezado. Para cambiar el color de un grupo de texto:

  1. Abre estilos de sitio y luego haz clic en Colores.
  2. Abre la combinación de colores de la sección que quieres editar.
  3. Haz clic en el ajuste de color que corresponda con el grupo de texto que deseas editar y, a continuación, elige un nuevo color.

Si necesitas pasos más detallados, accede a Cómo cambiar de color.

Color del bloque de texto

En un bloque de texto, puedes cambiar el color del texto seleccionado. Cambia los colores de las palabras individuales para que destaquen o cambia cada letra a un color diferente. Para establecer colores de texto personalizados:

  1. Haz clic en Editar en la página o elemento con el bloque de texto y, a continuación, haz clic dentro del bloque de texto.
  2. Resalta el texto que quieres cambiar. Esto puede ser una sola letra o palabra, o varias palabras.
  3. En la barra de herramientas de texto, haz clic en el ícono de color y luego elige un nuevo color. Haz clic en Paleta para elegir un color de la paleta de colores de todo el sitio o haz clic en Personalizado para usar el selector de color.
  4. Haz clic en Guardar para guardar tus cambios y seguir editando, o haz clic en Salir y luego Guardar para cerrar el editor.
RTE_click_color_circle.png

Ten en cuenta lo siguiente:

  • Cambiar los colores del texto en la barra de herramientas del bloque de texto anula cualquier color establecido en los estilos de sitio. Si luego cambias el color de ese mismo grupo de texto en los estilos del sitio, los cambios realizados desde la barra de herramientas se mantendrán.
  • Cambiar la combinación de colores de una sección anula todos los colores del texto y restablece el texto para que coincida con la configuración de color de esa combinación. Para restaurar los colores de texto personalizados en el bloque de texto, deberás volver a aplicarlos manualmente. 
  • Si cambias la combinación de colores de una sección, vuelve a la anterior: los colores de texto personalizados no se conservan. Tendrás que volver a aplicarlos manualmente.
  • El ícono de color solo aparece en bloques de texto, y no en otras barras de herramientas de texto.

En estilos del sitio, selecciona el ajuste de color que corresponda al grupo de texto que quieres editar. Si necesitas pasos más detallados, visita Cómo cambiar los colores.

Fuente

En estilos del sitio, haz clic en el grupo de texto que quieres editar y, a continuación, elige una nueva fuente. Si necesitas pasos más detallados, visita Cómo cambiar la fuente.

Espacio entre letras

La forma en que cambie el espaciado entre letras depende de la versión del sitio.

Para cambiar el espaciado entre letras:

  1. Mientras edites una página, haz clic en el ícono del pincel y, a continuación, en Fuentes.
  2. En Estilos de fuente globales, haz clic en el tipo de texto que quieres editar: Encabezados, Párrafos, Botones o Varios.
  3. Utiliza el control deslizante Espaciado entre letras para ajustar el espaciado o introduce un nuevo valor em.
  4. Haz clic en Guardar para guardar tus cambios y seguir editando, o haz clic en Salir y luego en Guardar para cerrar el editor.

En estilos del sitio, selecciona el ajuste Espaciado de letras para cambiar el espacio entre las letras.

Cuando configures el espacio entre las letras:

  • Los valores negativos pueden causar una superposición de caracteres. Mantén el espacio entre las letras en 0 px o más para evitar problemas de diseño en los dispositivos móviles.
  • Si los cambios de espacio no aparecen en tu dispositivo móvil, comprueba que el espaciado esté configurado en px, en lugar de en em. En las plantillas de las familias Bedford y Pacific, los encabezados tienen un espaciado máximo en los dispositivos móviles.

La altura de las líneas

La forma en que cambies la altura de línea depende de la versión del sitio.

Para cambiar la altura de línea:

  1. Mientras edites una página, haz clic en el ícono del pincel y, a continuación, en Fuentes.
  2. En estilos de fuente globales, haz clic en el tipo de texto que quieres editar: Encabezados, Párrafos, Botones o Varios.
  3. Utiliza el control deslizante Altura de línea para ajustar el espaciado o introduce un nuevo valor em.
  4. Tus cambios se mantienen mientras editas el contenido de otra página. Haz clic en Guardar para guardar tus cambios y seguir editando, o haz clic en Salir y luego en Guardar para cerrar el editor.

En estilos del sitio, usa el ajuste Altura de línea para cambiar el espacio entre líneas.

Nota

Una altura de la línea de 0em puede causar una superposición de texto, especialmente en dispositivos móviles.

Monoespacio o texto de código

El texto en monoespacio tiene la misma cantidad de espacio horizontal entre cada carácter. Cómo denominamos a este texto y la manera en la que ajustas su estilo depende de la versión de tu sitio.

El tamaño y la fuente del texto monoespacio utilizado en el título, subtítulo o leyenda de un bloque de imagen siguen el estilo de texto de Párrafos 2 en el panel de Fuentes. Todos los demás usos del texto monoespacio siguen el estilo de texto misceláneo. Para darle estilo a una fuente, visita Cambiar fuentes.

El color del texto en monoespacio sigue el ajuste de Párrafo (mediano) en el panel de Colores. Para cambiar el color de la fuente, visita Cómo cambiar colores.

El tamaño y el color del texto del código siguen los ajustes de cuerpo del texto. No es posible cambiar el estilo de fuente.

Párrafo o texto normal

El cuerpo del texto principal y cómo se aplica estilo depende de la versión de tu sitio.

El tamaño y la fuente del texto de párrafo siguen el estilo de texto Párrafos en el panel Fuentes.

El texto del sitio sigue la combinación de colores de todo el sitio. Alternativamente, puedes hacer que una sección de texto se destaque ajustando la combinación de colores de la sección.

Los cambios en los retoques de estilo de la fuente, el tamaño y el color del cuerpo del texto del sitio dependen de la familia de plantillas:

Plantilla

Fuente

Tamaño

Color

Adirondack

Contenido principal > Texto

Contenido principal > Texto

Contenido principal > Color del texto

Avenue

Tipografía > Cuerpo del texto

Tipografía > Cuerpo del texto

Colores > Color del texto

Aviator

Tipografía > Fuente del texto

Tipografía > Fuente del texto

Colores > Texto

Bedford

Contenido principal > Fuente del texto de la página

Contenido principal > Fuente del texto de la página

Contenido principal > Color del texto de la página

Brine

Contenido: Fuentes > Cuerpo del texto

Contenido: Fuentes > Cuerpo del texto

Contenido: Colores > Cuerpo del texto

Farro

Principal: Fuentes del contenido > Cuerpo del texto

Principal: Fuentes del contenido > Cuerpo del texto

Principal: Colores del contenido > Cuerpo del texto

Five

Contenido principal > Cuerpo del texto

Contenido principal > Cuerpo del texto

Contenido principal > Color del cuerpo del texto

Flatiron

Contenido principal > Texto

Contenido principal > Texto

Contenido principal > Color del texto

Forte

Tipografía > Cuerpo del texto

Tipografía > Cuerpo del texto

Tipografía > Color del cuerpo del texto

Galapagos

Todo el sitio > Fuente del cuerpo

Todo el sitio > Fuente del cuerpo

Todo el sitio > Color del cuerpo del texto

Ishimoto

Contenido principal > Texto

Contenido principal > Tamaño del texto

Contenido principal > Color del cuerpo del texto

Momentum

Contenido principal > Cuerpo del texto

Contenido principal > Cuerpo del texto

Contenido principal > Color del cuerpo del texto

Montauk

Tipografía > Cuerpo del texto

Tipografía > Cuerpo del texto

Colores > Color del texto

Native

Contenido principal > Cuerpo del texto

Contenido principal > Tamaño del cuerpo del texto

Contenido principal > Color del cuerpo del texto

Pacific

Contenido principal > Fuente del texto

Contenido principal > Fuente del texto

Contenido principal > Color del texto

Skye

Fuentes para todo el sitio > Cuerpo

Fuentes para todo el sitio > Cuerpo

Colores del texto para todo el sitio > Color del cuerpo del texto

Supply

Contenido principal > Fuente del texto

Contenido principal > Fuente del texto

Contenido principal > Color del cuerpo del texto

Tremont

Fuentes para todo el sitio > Fuente del cuerpo

Fuentes para todo el sitio > Fuente del cuerpo

Colores de fuentes para todo el sitio > Color del cuerpo

Wells

Opciones para todo el sitio > Texto

Opciones para todo el sitio > Tamaño del texto

Opciones para todo el sitio > Color de encabezados

Wexley

Contenido principal > Fuente del cuerpo del texto

Contenido principal > Fuente del cuerpo del texto

Contenido principal > Color del cuerpo del texto

York

Sitio: Tipografía > Fuente del cuerpo

Sitio: Tipografía > Fuente del cuerpo

Sitio: Tipografía > Color del cuerpo del texto

Cita

En un bloque de texto, el estilo de la cita varía según la versión de tu sitio.

El estilo de la cita sigue la fuente y el color para ese tipo de texto.

Por ejemplo, si el texto de la cita es texto del Encabezado 2, la cita tendrá la misma fuente y tamaño que el texto del Encabezado 2 del sitio. El color del texto de la cita seguirá los colores de esa sección.

Consejo

Como alternativa, usa un bloque de cita, que tiene sus propias opciones de estilo.

El estilo de la cita varía según la plantilla. Por ejemplo, en algunas plantillas, la cita tiene una línea vertical a la izquierda para añadir una separación gráfica.

Consejo

Como alternativa, usa un bloque de cita. Este bloque tiene sus propias opciones de estilo en algunas plantillas, las que permiten destacar la cita.

Estilos del texto de la cita

Estos son ejemplos de cómo ajustar el estilo del texto de la cita en estas familias de plantillas. En algunas plantillas, el texto de la cita sigue los mismos estilos que el bloque de cita.

Familia de plantillas

Fuente

Color

Línea

Adirondack

Sigue el cuerpo del texto

Sigue el cuerpo del texto

No

Avenue

Sigue el cuerpo del texto

Sigue el cuerpo del texto

Aviator

Ajuste de fuente de la cita

Ajuste de texto de la cita

No

Bedford

Sigue el cuerpo del texto

Sigue el cuerpo del texto

No

Brine

Sigue el cuerpo del texto

Sigue el cuerpo del texto

Farro

Sigue el cuerpo del texto

Sigue el cuerpo del texto

Five

Retoque de bloque de cita

Sigue el cuerpo del texto

No

Flatiron

Ajuste de fuente de la cita

Ajuste de color de la cita

No

Forte

Sigue el cuerpo del texto

Sigue el cuerpo del texto

No

Galapagos

Sigue el cuerpo del texto

Sigue el cuerpo del texto

Ishimoto

Sigue el cuerpo del texto

Sigue el cuerpo del texto

Momentum

Sigue el cuerpo del texto

Sigue el cuerpo del texto

No

Montauk

Sigue el cuerpo del texto

Sigue el cuerpo del texto

Native

Ajustes de citas y tamaño de la cita

Sigue el cuerpo del texto

Pacific

Sigue el cuerpo del texto

Sigue el cuerpo del texto

Skye

Sigue el cuerpo del texto

Sigue el cuerpo del texto

Supply

Sigue el cuerpo del texto

Sigue el cuerpo del texto

Tremont

Sigue el cuerpo del texto

Sigue el cuerpo del texto

Wells

Ajustes de cita y tamaño de la cita

Sigue el cuerpo del texto

No

Wexley

Ajuste de fuente de la cita

Sigue el cuerpo del texto

No

York

Sigue el cuerpo del texto

Sigue el cuerpo del texto

Tamaño

El proceso para cambiar el tamaño del texto depende de la versión del sitio.

En el panel Fuentes, haz clic en un paquete de fuentes para aplicarlo al sitio y, a continuación, elige un tamaño base. Todo el texto restante se escala según este tamaño. También puedes hacer clic en Asignar estilos para establecer el tamaño de fuente para un área de texto específica.

Para ver los pasos completos, visita Cómo cambiar fuentes.

En estilos del sitio, selecciona el ajuste Tamaño para elegir el tamaño de la fuente. Puedes usar el control deslizante o ingresar manualmente un tamaño de fuente.

En algunas plantillas, puedes establecer el tamaño máximo o mínimo de las fuentes en diferentes tamaños de pantalla. Obtén más información en Cómo ajustar la escala de fuentes.

Consejo

Todos los sitios de Squarespace tienen integrado un diseño adaptativo que optimiza el tamaño de texto del sitio para cada pantalla.

Transformación de texto

Utiliza Transformación de texto para aplicar estilos de mayúsculas al texto, tales como:

  • Escribir en mayúsculas: Escribe En Mayúsculas La Primera Letra De Cada Palabra.
  • Mayúsculas: TODAS MAYÚSCULAS.
  • Minúsculas: pone todas las letras en minúsculas

Este retoque solo se aplica a determinadas fuentes y grupos de texto.

La transformación de texto aparece en distintas áreas según la versión del sitio.

  1. Mientras edites una página, haz clic en el ícono del pincel y, a continuación, en Fuentes.
  2. En Estilos de fuentes globales, haz clic en el tipo de texto que quieres cambiar: Encabezados, Párrafos, Botones o Varios.
  3. Elige una opción de estilo en el menú desplegable Transformación de texto.
  4. Tus cambios se mantienen mientras editas el contenido de otra página. Haz clic en Guardar para guardar tus cambios y seguir editando, o haz clic en Salir y luego en Guardar para cerrar el editor.

En estilos del sitio, utiliza el menú desplegable Transformación de texto en cualquier ajuste de la fuente.

Peso

La forma en que cambies el peso del texto depende de la versión de tu sitio web.

  1. Mientras edites una página, haz clic en el ícono del pincel y, a continuación, en Fuentes.
  2. En Estilos de fuentes globales, haz clic en el tipo de texto que quieres cambiar: Encabezados, Párrafos, Botones o Varios.
  3. Elija una opción de peso en el menú desplegable Peso.
  4. Tus cambios se mantienen mientras editas el contenido de otra página. Haz clic en Guardar para guardar tus cambios y seguir editando, o haz clic en Salir y luego en Guardar para cerrar el editor.

En estilos del sitio, utiliza el menú desplegable Densidad en cualquier ajuste de fuente para que el texto sea más grueso o más fino.

Footer Image
  • Recibe ayuda de nuestra comunidad

  • Recibe la ayuda de nuestra comunidad para personalizaciones avanzadas.

  • Contrata a un Squarespace Expert

  • Destácate en línea con la ayuda de un diseñador o desarrollador con experiencia.