Logo
DocsCrear Invitaciones

Personalizar tema y diseño

Aprende cómo cambiar los colores, fuentes y diseño de la invitación a tu estilo.

8 min read
2025-01-15

Personalizar tema y diseño

¡Personaliza tu invitación a tu propio estilo! Puedes cambiar colores, fuentes y diseño.

Encontrar la configuración de tema

¿Dónde cambiarla?

Ubicación:

  1. Área izquierda de la pantalla de edición
  2. Haz clic en la pestaña "Configuración de tema" entre las pestañas superiores
  3. Se muestran varias opciones de personalización

Configuraciones principales:

  • 🎨 Color principal
  • 🖋️ Fuente (tipografía)
  • 📐 Diseño
  • ✨ Efectos

¿Tema primero? ¿Contenido primero?

Orden recomendado:

  1. Primero ingresa todo el contenido
  2. Luego configura el tema
  3. Ajusta viendo la armonía general

¿Por qué? ¡Solo cuando hay contenido puedes verificar si los colores y fuentes combinan bien!

Cambiar el color principal

Cambia el color principal de toda la invitación.

Seleccionar color principal

Partes donde se aplica:

  • Color de títulos y subtítulos
  • Color de botones
  • Color de puntos de énfasis
  • Color de iconos

Método de selección de color:

Método 1: Colores predefinidos

💗 Rosa romántico 💙 Azul clásico 💛 Dorado cálido 💚 Verde natural 🖤 Negro moderno 🤍 Blanco puro

  1. Haz clic en la sección "Color principal"
  2. Selecciona entre los colores preparados
  3. ¡Se aplica inmediatamente al hacer clic!

Método 2: Color personalizado

  1. Haz clic en "Color personalizado"
  2. Aparece el selector de color
  3. Haz clic en el color deseado
  4. O ingresa el código HEX (ej: #FFB6C1)
  5. Botón "Aplicar"

Seleccionar color secundario

¡En armonía con el color principal!

Partes donde se aplica:

  • Color de fondo de sección
  • Color de líneas divisorias
  • Color de texto pequeño

Consejos de selección:

  • Tono más claro que el color principal
  • O un color diferente de la misma familia
  • El contraste no debe ser demasiado fuerte

Guía de combinación de colores

Romántico:

  • Principal: Rosa (#FFB6C1)
  • Secundario: Rosa claro (#FFE4E8)
  • Texto: Gris (#555555)

Moderno:

  • Principal: Negro (#000000)
  • Secundario: Dorado (#FFD700)
  • Texto: Blanco (#FFFFFF)

Natural:

  • Principal: Verde (#8FBC8F)
  • Secundario: Beige (#F5F5DC)
  • Texto: Marrón (#8B4513)

Vista previa de colores

¡Asegúrate de verificar después de cambiar el color!

Puntos a verificar:

  • ✓ ¿El texto se ve bien?
  • ✓ ¿Combina bien con las fotos?
  • ✓ ¿No lastima demasiado los ojos?
  • ✓ ¿La armonía general es buena?

Método de prueba:

  1. Desplázate por la vista previa de la derecha
  2. Verifica todas las secciones
  3. Verifica también en el móvil

Cambiar la fuente (tipografía)

¡Cambia mucho la sensación de la invitación!

Fuentes en español

Fuentes proporcionadas:

1. Noto Sans (Noto Sans)

Sensación limpia y moderna Buena legibilidad Se ve bien en todos los dispositivos

  • Características: Sensación sans-serif, gótica
  • Recomendado: Invitación moderna, diseño simple

2. Noto Serif (Noto Serif)

Sensación lujosa y tradicional Aspecto formal Perfecto para bodas

  • Características: Serif, con remates
  • Recomendado: Invitación clásica, sensación elegante

3. Roboto

Sensación suave y cómoda Moderna y amigable Máxima legibilidad

  • Características: Redondeada, amigable
  • Recomendado: Invitación cálida, ambiente cómodo

4. Open Sans

Sensación limpia y profesional Versatilidad excelente Legibilidad perfecta

  • Características: Sans-serif balanceada
  • Recomendado: Todo tipo de eventos, uso versátil

5. Dancing Script (Fuente manuscrita)

Sensación cálida y personalizada Invitación con toque humano Amigable y emotiva

  • Características: Como escrito a mano
  • Recomendado: Invitación casual, diseño personalizado

Fuentes en inglés

¡Si hay texto en inglés!

Fuentes proporcionadas:

  • Playfair Display: Elegante y sofisticado
  • Montserrat: Moderno y limpio
  • Dancing Script: Sensación manuscrita
  • Great Vibes: Caligrafía ornamentada

Ajustar el tamaño de la fuente

Partes ajustables:

  • Tamaño del título: 24-48px
  • Tamaño del cuerpo: 14-18px
  • Texto pequeño: 12-14px

Método:

  1. Deslizador de "Tamaño de fuente"
  2. Arrastra a izquierda o derecha
  3. Vista previa en tiempo real

Tamaño recomendado:

  • Tamaño cómodo para móvil: 16px
  • Si es demasiado pequeño no se ve
  • Si es demasiado grande se ve caótico

Precaución con la combinación de fuentes

  • Fuente española 1 + Fuente inglesa 1 (máximo 2)
  • Evita demasiadas fuentes
  • La consistencia es importante
  • ¡La legibilidad es lo primero!

Estilo de diseño

Selecciona el método de disposición general de la invitación.

Estilo 1: Alineación central

Título Novio ♥ Novia 2025-03-15

Contenido contenido contenido Contenido contenido contenido

Características:

  • Todos los elementos en el centro
  • Simétrico y estable
  • Tradicional y seguro

Recomendado:

  • Boda clásica
  • Cuando quieres sensación tradicional
  • ¡Sin riesgos!

Estilo 2: Alineación izquierda

Título Novio ♥ Novia 2025-03-15

Contenido contenido contenido Contenido contenido contenido

Características:

  • Todos los elementos a la izquierda
  • Moderno y sofisticado
  • Sensación de revista

Recomendado:

  • Diseño contemporáneo
  • Invitación simple
  • Sensación minimalista

Estilo 3: Estilo tarjeta

┌───────────┐ │ Título │ │ Novio♥Novia │ │ 2025-03-15 │ └───────────┘

┌───────────┐ │ Contenido │ │ Contenido │ └───────────┘

Características:

  • Cada sección en forma de tarjeta
  • Separación limpia
  • Distinción clara

Recomendado:

  • Cuando hay mucha información
  • Énfasis en legibilidad
  • Diseño moderno

Ajustar espaciado y márgenes

¡Para respirar!

Espaciado entre secciones

Opciones de espaciado:

  • Estrecho: 10-20px

    • Sensación compacta
    • Cuando hay mucha información
  • Normal: 30-40px (predeterminado, recomendado)

    • Espacio adecuado
    • Lo más seguro
  • Amplio: 50-80px

    • Espacioso y lujoso
    • Adecuado para diseño minimalista

Márgenes laterales

Opciones:

  • Estrecho: Pantalla completa
  • Normal: Margen adecuado
  • Amplio: Concentración en el centro

Consejos de diseño

  • Cuanto más margen, más lujoso
  • Si hay mucha información, espaciado estrecho
  • Si hay muchas fotos, margen amplio
  • ¡Mantén la consistencia!

Estilo de fondo

Color de fondo

Opciones:

  • Blanco: Limpio y brillante
  • Marfil: Cálido y suave
  • Beige: Natural y cómodo
  • Gris claro: Moderno y sofisticado

Patrón de fondo

Selección posible:

  • Ninguno (color sólido)
  • Textura sutil
  • Patrón de ondas
  • Patrón de flores (tenue)

Método de aplicación:

  1. Sección "Fondo"
  2. Seleccionar patrón
  3. Ajustar transparencia (se recomienda 10-30%)
  4. ¡Si es demasiado intenso, el texto no se ve!

Estilo de botones

Forma de botones

Estilos:

  • Esquinas redondeadas: Sensación suave
  • Esquinas cuadradas: Sensación moderna
  • Completamente redondo: Lindo y casual
  • Solo subrayado: Minimalista

Color de botones

Opciones:

  • Usar color principal (automático)
  • Especificar color personalizado
  • Efecto degradado

Efectos de animación

¡Agrega movimiento!

Efecto de transición de página

Opciones:

  • Fade in: Aparece gradualmente
  • Slide up: Sube desde abajo
  • Ninguno: Muestra inmediatamente

Recomendado:

  • Fade in es seguro en la mayoría de los casos
  • Evita lo demasiado llamativo

Efecto hover

¡Cuando pasas el mouse!

Botones:

  • Cambio de color
  • Aumenta ligeramente
  • Aparece sombra

Fotos:

  • Ampliar
  • Aclarar
  • Cambio de filtro

No hay hover en móvil

¡Los efectos hover no funcionan en móviles! (No hay mouse porque es pantalla táctil) No pongas información importante en el hover.

Presets de tema

¡Temas pre-creados de una vez!

Preset 1: Rosa romántico

Configuración:

  • Color principal: Rosa (#FFB6C1)
  • Fuente: Noto Sans
  • Diseño: Alineación central
  • Fondo: Marfil
  • Efecto: Pétalos cayendo

Sensación: Encantador y romántico

Preset 2: Negro moderno

Configuración:

  • Color principal: Negro
  • Color secundario: Dorado
  • Fuente: Noto Serif
  • Diseño: Alineación izquierda
  • Fondo: Blanco puro
  • Efecto: Ninguno

Sensación: Sofisticado y lujoso

Preset 3: Verde natural

Configuración:

  • Color principal: Verde
  • Fuente: Roboto
  • Diseño: Alineación central
  • Fondo: Beige
  • Efecto: Animación sutil

Sensación: Natural y cómodo

Preset 4: Azul clásico

Configuración:

  • Color principal: Azul marino
  • Fuente: Noto Serif
  • Diseño: Alineación central
  • Fondo: Blanco
  • Efecto: Ninguno

Sensación: Tradicional y confiable

Diseño responsive

¡En varios tamaños de pantalla!

Ajuste automático

Lo que se ajusta automáticamente:

  • Tamaño de fuente
  • Tamaño de imagen
  • Espaciado y márgenes
  • Tamaño de botones

Ajuste manual necesario:

  • Ocultar secciones específicas (en móvil)
  • Cambiar orden de imágenes

Consejos de optimización móvil

Lista de verificación:

  • ¿El tamaño del texto es suficiente? (mínimo 14px)
  • ¿Los botones son fáciles de hacer clic? (mínimo 44x44px)
  • ¿Las imágenes cargan rápido?
  • ¿No hay scroll horizontal?

Lista de verificación de finalización

¡Configuración de tema completa!

  • Color principal seleccionado
  • Fuente seleccionada (solo 1-2)
  • Estilo de diseño seleccionado
  • Espaciado y márgenes ajustados
  • Estilo de fondo configurado
  • Verificado en escritorio
  • Verificado en móvil
  • Pedir opinión a otras personas
  • ¡Guardar!

Crear el tema perfecto

  1. Probar varias combinaciones
  2. Tomar capturas de pantalla y comparar
  3. Volver a ver después de un día
  4. ¡La sensación al verlo por primera vez es importante!

Próximos pasos

¡Una vez que hayas completado el tema!

Volver a verificar:

Trabajo final: