> ## Documentation Index
> Fetch the complete documentation index at: https://docs.scanova.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Temas

> Elija y personalice un tema con 21 estilos preestablecidos y anulaciones completas a nivel de token.

## Qué controla un tema

Un tema controla el estilo visual general de una página de destino: color de fondo, color de superficie, color de texto, color de acento, fuente, radio de esquina y estilo de sombra/superficie. Cambiar de tema actualiza instantáneamente todos los bloques de la página — los temas nunca cambian su contenido, solo su apariencia.

## Abrir el selector de temas

Haga clic en el botón **Theme** en el encabezado del Page Builder. El selector de temas se abre en el panel derecho, mostrando temas preestablecidos (pestaña **Presets**) y cualquier tema que haya guardado (pestaña **Saved**).

## Temas preestablecidos

El selector tiene **21 temas preestablecidos**, distribuidos en dos páginas de 12 y 9 tarjetas.

<Frame caption="Temas preestablecidos, página 1 de 2 — Modern, Classic, Midnight, Emerald, Aqua, Sharp, Pill, Flat, Navy, Sage, Noir, Coral Pop">
  <img src="https://mintcdn.com/scanova-api/q8t3kzcRTgAP7jV0/images/v2/page-builder/themes/preset-themes-page1.png?fit=max&auto=format&n=q8t3kzcRTgAP7jV0&q=85&s=c4d5f9eee75f3ce0e2f6e093e78e9c69" alt="Pestaña Presets del selector de temas, página 1, mostrando 12 tarjetas de tema preestablecido con muestras de color y nombres" width="1440" height="1200" data-path="images/v2/page-builder/themes/preset-themes-page1.png" />
</Frame>

<Frame caption="Temas preestablecidos, página 2 de 2 — Terracotta Craft, Cobalt Tech, Blush Romance, Charcoal Editorial, Mint Festive, Aurora Pulse, Prism Glass, Frosted, Legacy">
  <img src="https://mintcdn.com/scanova-api/q8t3kzcRTgAP7jV0/images/v2/page-builder/themes/preset-themes-page2.png?fit=max&auto=format&n=q8t3kzcRTgAP7jV0&q=85&s=07671aab459b8ca50e4d0f32a5c139d8" alt="Pestaña Presets del selector de temas, página 2, mostrando las 9 tarjetas de tema preestablecido restantes con muestras de color y nombres" width="1440" height="1200" data-path="images/v2/page-builder/themes/preset-themes-page2.png" />
</Frame>

| Página | Temas preestablecidos                                                                                                      |
| ------ | -------------------------------------------------------------------------------------------------------------------------- |
| 1      | Modern, Classic, Midnight, Emerald, Aqua, Sharp, Pill, Flat, Navy, Sage, Noir, Coral Pop                                   |
| 2      | Terracotta Craft, Cobalt Tech, Blush Romance, Charcoal Editorial, Mint Festive, Aurora Pulse, Prism Glass, Frosted, Legacy |

<Warning>
  Documentación anterior describía "diez temas preestablecidos" e incluía **Royal, Retro, Sunset** y **Mono Dark** entre ellos. Ninguno de esos cuatro existe en el selector actual — el catálogo ha crecido desde entonces a 21 preestablecidos, seis de los cuales (Modern, Classic, Midnight, Emerald, Navy, Aqua) provienen de los diez originales.
</Warning>

Haga clic en cualquier tarjeta de tema para aplicarlo. El lienzo se actualiza de inmediato para que pueda comparar temas sin salir del editor.

## Anulaciones de tema

Después de seleccionar un preestablecido, haga clic en **Customise** en su tarjeta para abrir un panel donde puede anular de forma independiente cualquiera de los tokens de diseño del tema sin cambiar el preestablecido base. El panel está organizado en siete secciones, en este orden:

<Frame caption="Las siete secciones plegables del panel Customise">
  <img src="https://mintcdn.com/scanova-api/q8t3kzcRTgAP7jV0/images/v2/page-builder/themes/customise-panel-sections.png?fit=max&auto=format&n=q8t3kzcRTgAP7jV0&q=85&s=d257440b7605620bfccb2f54c83a6c68" alt="Panel Customise mostrando siete secciones plegables: Color, Background, Typography, Shape, Surface, Effects, Spacing" width="1440" height="1200" data-path="images/v2/page-builder/themes/customise-panel-sections.png" />
</Frame>

### Color

Anule los tokens de color del tema de forma individual: Background, Surface, Surface alt, Accent, Button text (accent foreground), Heading, Body, Muted y Border. Cada campo recurre al valor del preestablecido cuando se deja vacío.

### Background

Elija cómo se renderiza el fondo de la página — un Color sólido, un Gradient (ángulo y paradas de color), una Image (con controles de ajuste y opacidad) o un Video (con control de opacidad) — además de un efecto de fondo (consulte [Efectos animados](/es/page-builder/animated-effects)).

**Block transparency** — cuando hay un efecto de fondo activo, este control deslizante determina cuánto se desvanece la superficie propia de un bloque "Full width" para dejar ver el efecto por debajo. Se aplica sin importar el tipo de fondo.

### Typography

Anule la familia tipográfica por separado para encabezados, texto de cuerpo, y etiquetas/botones. Elija de la lista de fuentes integradas, o escriba el nombre de cualquier Google Font (por ejemplo, `Montserrat` o `Roboto`) para usarla en lugar de la familia predeterminada del preestablecido.

<Note>
  Las anulaciones de fuente aquí se aplican a cualquier bloque que no tenga su propia configuración de fuente por bloque. La fuente de la pestaña [Design](/es/page-builder/design-options) propia de un bloque, cuando está definida, tiene prioridad sobre esta anulación a nivel de tema.
</Note>

### Shape

Anule el radio de esquina de forma independiente para botones, tarjetas, imágenes y campos de entrada.

### Surface

Anule la sombra y el estilo de superficie usados en tarjetas y bloques elevados, incluyendo un control **Card material** (Preset default / Card / Subtle / Elevated) junto con el control de variante de sombra.

<Note>
  Esta sección antes se llamaba "Shadow" en documentación anterior. Ahora se denomina **Surface** y también expone un control Card material además de la variante de sombra. Los mismos tokens Card Surface y Shadow se pueden anular por bloque — consulte [Opciones de diseño](/es/page-builder/design-options).
</Note>

### Effects

Defina los efectos predeterminados de fondo, tarjeta y botón a nivel de tema. Consulte [Efectos animados](/es/page-builder/animated-effects) para ver el catálogo completo.

### Spacing

Controle cuánto espacio de respiro usa la página.

* **Space between blocks** — el espacio vertical que separa cada bloque en la página.
* **Spacing scale** — un control deslizante que hace que todo el espaciado de la página sea más compacto o más amplio a la vez (espacios, relleno de tarjetas, espaciado entre bloques) sin cambiar el tamaño del texto. Déjelo en el valor predeterminado para la densidad del tema, o ajústelo para un diseño más aireado o más denso.

## Modo oscuro y claro

Los temas se definen con una paleta de colores fija — no cambian automáticamente entre modo oscuro y claro según la preferencia del dispositivo del visitante. Si desea una página oscura, elija un preestablecido oscuro (por ejemplo, Midnight o Noir) o configure un color de fondo oscuro mediante la anulación.

## Anulaciones de diseño por bloque

Además de los temas a nivel de página, muchos bloques tienen su propia pestaña Design en el inspector donde puede anular colores, fuentes y estilo de tarjeta solo para ese bloque. Consulte [Opciones de diseño](/es/page-builder/design-options) para más detalles.

## Restablecer anulaciones

Para eliminar una anulación y volver al valor predeterminado del tema, borre el campo en el panel Customise. Un campo vacío indica a la página que use el valor del tema.

## Relacionado

* [Opciones de diseño](/es/page-builder/design-options) — anulaciones por bloque de los mismos tokens definidos aquí.
* [Efectos animados](/es/page-builder/animated-effects) — efectos de fondo, tarjeta y botón configurados desde la sección Effects.
* [Descripción general del Page Builder](/es/page-builder/overview) — dónde vive el botón Theme en el encabezado del editor.
