Lo que vas a construir
Una landing page profesional y responsive que funciona en cualquier dispositivo. Tendra un hero section con gradiente llamativo, secciones de beneficios con iconos, testimonios de clientes, y un boton de llamada a accion (CTA). Usaras HTML y Tailwind CSS para crear un diseno moderno que puedes publicar gratis en GitHub Pages o Vercel.
Estructura tipica
- Hero - Titulo grande + llamada a accion
- Beneficios - Por que elegirte
- Como funciona - Pasos simples
- Testimonios - Prueba social
- CTA final - Boton de accion
Paso 1: Pídele a una IA el diseño
Necesito una landing page moderna con:
- Hero con gradiente de fondo
- Sección de 3 beneficios con iconos
- Sección "Cómo funciona" con 3 pasos
- Testimonios con avatares
- Footer con links
- HTML + Tailwind CSS
- Responsive (móvil primero)
Dame el código completo.
Paso 2: Crea el proyecto
mkdir mi-landing
cd mi-landing
Pega el HTML en index.html
Paso 3: Ábrelo
open index.html # macOS
Tips de diseño
| Elemento | Tip |
|---|---|
| Título | Claro, beneficio directo |
| CTA | Color contrastante, verbo de acción |
| Imágenes | Optimizadas, relevantes |
| Espaciado | Abundante espacio en blanco |
Publicar
Sube a GitHub Pages o Vercel:
git init
git add .
git commit -m "Landing page"
# Sube a GitHub y activa Pages
Próximo paso
→ Portfolio Personal — Muestra tu trabajo