Cómo abrirla
Dentro del editor de un formulario o una encuesta, haz clic en Estilos y opciones (Styles & Options), en la esquina superior derecha. Vuelve a pulsar el mismo botón para ocultarla. La barra tiene tres pestañas:Pestaña Estilos
Es donde defines la base visual del formulario o la encuesta.- Diseño: controla cómo se presentan los campos y las etiquetas, los anchos, el espaciado, el relleno (padding) y el margen superior. Usa el margen superior para separar el formulario de lo que tenga encima sin recurrir a CSS. Si dejas los campos de margen vacíos, se mantiene el espaciado predeterminado.
- Relleno a 0 px: puedes poner el relleno superior e inferior en 0 px para lograr un diseño de borde a borde real, también en la versión publicada.
- Pie de página (encuestas): controla la navegación y el progreso que ve la persona al avanzar por la encuesta. Puedes elegir si el pie se queda pegado a la tarjeta o a la página, cambiar el fondo, la altura y la tipografía, activar la barra de progreso y personalizar el tipo, la posición, el texto y los colores de los botones Anterior, Volver, Siguiente y Enviar.
- Colores y fondo: define la tipografía, el color de fondo y, donde está disponible, imágenes de fondo o de encabezado. Aquí también está el color primario, que se usa en los estados de interacción de los campos.
Pestaña Temas
Los temas son diseños listos que te dan un aspecto profesional en segundos. Lo habitual es aplicar un tema primero y después afinar espaciados y anchos desde Estilos. Para aplicar uno, pasa el cursor sobre el tema, haz clic en Usar tema y confirma con Continuar (Proceed).Panel de estilo de botones
Al hacer clic en el botón de envío dentro del lienzo, la barra lateral muestra la sección Botón con todos sus controles agrupados.1
Elige un tema de botón
Pulsa Seleccionar temas y revisa las categorías Relleno (Filled), Borde (Border) y Solo texto (Text Only). Al pasar el cursor sobre un tema ves el resultado en el lienzo. Pulsa Aplicar para usarlo.
2
Ajusta los detalles
Personaliza el tema con los grupos de controles:
- Colores y fondo: color del texto, del fondo y del borde.
- Tipografía: fuente (admite fuentes personalizadas), grosor, tamaño, espaciado entre letras y mayúsculas o minúsculas.
- Diseño y alineación: izquierda, centro o derecha, y la opción Ancho completo.
- Relleno: vertical y horizontal, vinculados o por separado.
- Borde y radio de esquinas: grosor, estilo y redondeo.
- Sombra: actívala y ajusta desenfoque, distancia y extensión.
3
Deshaz si lo necesitas
Usa Restablecer o Revertir para deshacer cambios, o vuelve a Seleccionar temas para empezar desde otro diseño.
Pestaña Avanzado
Úsala cuando necesites un control más fino:- Formulario: bordes, esquinas y sombra del contenedor.
- Campo de entrada: colores de texto y de enfoque, bordes, esquinas, ancho, relleno y sombras de los campos.
- Etiqueta: tipografía y color de las etiquetas.
- Etiqueta corta: tipografía y color de las etiquetas cortas.
- Marcador de posición: aspecto del texto de ejemplo dentro de los campos.
- CSS personalizado: reglas propias para un control total.
El CSS personalizado tiene prioridad sobre los estilos y los temas. Si algo no se ve como esperas después de cambiar de tema, revisa primero tu CSS.
Alineación de etiquetas por campo
Además de la alineación global, puedes definir la posición de la etiqueta de cada campo por separado. Es útil para ajustar el ritmo visual en diseños compactos.1
Selecciona un campo
En el editor, haz clic en un solo campo.
2
Elige la alineación
En la barra lateral, busca Alineación de etiqueta y elige Arriba, Izquierda, Derecha o Predeterminado del formulario.
- Funciona en formularios, encuestas y cuestionarios, solo con el diseño de una columna.
- Se aplica a los campos estándar: texto, desplegables, opciones únicas y similares.
- Los formularios existentes conservan su alineación global hasta que cambies algún campo.
- En celulares, la etiqueta siempre se muestra arriba, sin importar lo que definas para escritorio.
Preguntas frecuentes
¿Los cambios de la barra lateral se guardan solos?
¿Los cambios de la barra lateral se guardan solos?
No. Haz clic en Guardar en el editor para conservarlos.
¿Cambiar de tema borra mi diseño detallado?
¿Cambiar de tema borra mi diseño detallado?
Puede restablecer parte del estilo visual. Revisa la pestaña Estilos después de cambiar de tema. El CSS personalizado sigue teniendo prioridad sobre temas y estilos.
¿Cómo pruebo un tema sin perder mi diseño actual?
¿Cómo pruebo un tema sin perder mi diseño actual?
Aplica el tema y, si no te convence, pulsa el botón Atrás en la esquina superior derecha del editor para recuperar el aspecto anterior.
¿Qué pasa con la alineación por campo si cambio a dos columnas o a una sola línea?
¿Qué pasa con la alineación por campo si cambio a dos columnas o a una sola línea?
La alineación por campo solo existe en el diseño de una columna. Si cambias de diseño, los campos vuelven a la alineación predeterminada.
Si cambio la alineación global, ¿qué pasa con los campos que ya ajusté?
Si cambio la alineación global, ¿qué pasa con los campos que ya ajusté?
Los campos con Predeterminado del formulario adoptan la nueva alineación global. Los que definiste como Arriba, Izquierda o Derecha conservan su elección.
Artículos relacionados
Color primario en formularios
Aplica el color de tu marca a las interacciones de los campos.
CSS personalizado en formularios
Ajustes visuales avanzados con tus propias reglas.
Editor móvil de formularios
Estilos independientes para celulares.
Edición en línea
Edita textos directamente en la vista previa.