> For the complete documentation index, see [llms.txt](https://docs.dapta.ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.dapta.ai/dapta-docs-es/dforms/design.md).

# Diseño y marca

Haz que un formulario de dForms se parezca a tu marca desde el panel Diseño, dentro de Construir: idioma y texto de los botones, temas, colores, tipografías, logos, portada y tarjeta al compartir, con

Diseño es la tercera pestaña del editor. Ábrela y el lienzo se reemplaza por dos columnas: todos los ajustes visuales a la izquierda, y una vista previa en vivo del formulario real a la derecha. Cada cambio aparece en la vista previa de inmediato y se guarda como borrador; haz clic en **Publicar** cuando quieras que lo vea quien responde.

***

**Paso 1:** Abre tu formulario y abre la pestaña **Diseño** en la barra superior del editor. Haz clic en **Construir** para volver al lienzo de preguntas.

<figure><img src="https://365551146-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMUYDYzjmxpzlYaw0gcaZ%2Fuploads%2Fgit-blob-74e5f0bf7c22f021e39987be32a794fa5670b9bd%2Fforms-readme-design-01-design-mode.png?alt=media" alt="El editor en la pestaña Diseño: la pestaña Diseño resaltada, la columna de ajustes empieza con las tarjetas Idioma y Texto de los botones, y la vista previa del dispositivo a la derecha"><figcaption><p>La pestaña Diseño. Izquierda: los ajustes, agrupados en tarjetas, empezando por <strong>Idioma</strong> y <strong>Texto de los botones</strong>. Derecha: la vista previa en vivo de tu formulario.</p></figcaption></figure>

La columna de la izquierda está organizada en tarjetas, de arriba abajo: **Idioma**, **Texto de los botones**, **Título del formulario**, **Diseño** (Diapositivas o Una página), **Tema**, **Colores**, **Tipografía**, **Forma y controles**, **Distribución** (logos, insignia de atribución, alineación, ancho, transición), **Tarjeta al compartir**, **Portada**, **Logos de clientes**, un enlace a **Envíos parciales** (que se configuran en la lista de preguntas de la pestaña Construir) y **Cuando termina el formulario**.

***

**Paso 2:** Usa los controles de vista previa que están arriba de la columna derecha. **Móvil**, **Tablet** y **Escritorio** cambian el marco del dispositivo (el tamaño y el zoom se muestran al lado, por ejemplo 1280 × 800 · 45%). Las flechas recorren las pantallas (**Pantalla anterior**, **Pantalla siguiente**), y la flecha circular reinicia la vista previa. La barra de dirección muestra el enlace público, `app.dforms.ai/{código de cuenta}/f/{slug}`, con botones para copiarlo y para abrir el formulario en vivo.

<figure><img src="https://365551146-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMUYDYzjmxpzlYaw0gcaZ%2Fuploads%2Fgit-blob-bf98da89cb75bffb1c69149de9a215d818c0e2dd%2Fforms-readme-design-02-preview-devices.png?alt=media" alt="La columna de vista previa con las flechas de paso y el selector Móvil, Tablet y Escritorio resaltados, y un enlace /f/ en la barra de dirección"><figcaption><p>La vista previa ejecuta el renderizador real del formulario. Nada de lo que escribas ahí se envía.</p></figcaption></figure>

> **💡 Tip:** La vista previa muestra tu borrador, incluidas las ediciones sin publicar, en el idioma del formulario (mira [Idioma y texto de los botones](/dapta-docs-es/dforms/design/language-and-button-text.md)). Quien responde sigue viendo la última versión publicada hasta que haces clic en **Publicar**.

> **⚠️ Nota:** Un **Kit de marca** del workspace puede prellenar el logo, los colores, la tipografía y los controles de cada formulario nuevo. Lo que cambies aquí aplica solo a este formulario.

## Páginas de esta sección

* [Idioma y texto de los botones](/dapta-docs-es/dforms/design/language-and-button-text.md): el idioma de los botones y mensajes que ven los visitantes, y tu propio texto para Atrás, Siguiente y Enviar.
* [Temas, colores y fondo](/dapta-docs-es/dforms/design/themes-colors-background.md): elige uno de los nueve temas, define Fondo, Texto y Color de marca con comprobación de contraste, y escoge un fondo Plano, Degradado, Resplandor o Imagen.
* [Tipografía y controles](/dapta-docs-es/dforms/design/typography-and-controls.md): elige una tipografía (o aloja la tuya), y define esquinas, estilo de botón, botón de ancho completo y el indicador de progreso.
* [Logos, distribución y transiciones](/dapta-docs-es/dforms/design/logos-layout-transitions.md): logo del formulario y logo de la portada, tamaño y posición del logo, tamaño de la insignia de atribución, alineación de la pregunta, ancho del contenido, transición entre pasos y el título público del formulario.
* [Portada y banner](/dapta-docs-es/dforms/design/cover-screen-and-banner.md): la pantalla de entrada que se muestra antes de la primera pregunta, con banner, titular, subtítulo, botón de inicio e sello de confianza.
* [Marquesina de logos de clientes](/dapta-docs-es/dforms/design/client-logos.md): una tira de logos de «confían en nosotros» en la portada, en la pantalla de revelación o en ambas.
* [Tarjeta al compartir](/dapta-docs-es/dforms/design/share-card.md): la imagen que se ve cuando el enlace se comparte en chat o en redes, generada a partir de tu diseño o puesta por ti.
* [Kit de marca (para todo el workspace)](/dapta-docs-es/dforms/design/brand-kit.md): la apariencia del workspace con la que arrancan los formularios nuevos, y cómo aplicarla a los que ya existen.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.dapta.ai/dapta-docs-es/dforms/design.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.