NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia **Educa Sierra** (coaching y desarrollo personal) usando **HTML estático + Tailwind CDN + JavaScript vanilla en un solo archivo**. Reproduce el diseño visual y la estructura del sitio analizado, respetando los siguientes requisitos:
- **Paleta de colores**: #1A1A2E (azul marino profundo), #16213E (gris azulado), #0F3460 (azul acento), #E94560 (rojo coral para botones), #FFFFFF (blanco) y tonos de gris #F0F0F0, #CCCCCC.
- **Tipografía**: encabezados con `font-family: 'Inter', sans-serif; font-weight: 700;` y cuerpo con `font-family: 'Inter', sans-serif; font-weight: 400;`.
- **Header**: barra de navegación fija, logo a la izquierda, menú principal con enlaces (Home, Programa, Sobre Nosotros, Blog, Contacto) y dos dropdowns (Multi Layout, Pá
4.802 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.802 caracteres · licencia libre
Solo descarga completa disponible
CAPTURA COMPLETA · HOME
Para que Claude replique el diseño con máxima fidelidad, descarga la imagen y adjúntala en tu chat.
Descargar captura
ESTRUCTURA DEL SITIO
Tabla de secciones
HOME
- 1.1 Cabecera con logo y menú desplegable
- 1.2 Hero: título principal, descripción, dos botones CTA, video de fondo
- 1.3 Área de testimonios con imágenes pequeñas y cita destacada
- 1.4 Contador animado de visitantes diarios + texto de satisfacción
- 1.5 Sección Programa: subtítulo, encabezado, cuadrículas de programas con imagen, título y breve descripción, overlay y enlace
- 1.6 Footer: enlaces de navegación, información de contacto, iconos sociales
ABOUT
- 2.1 Cabecera compartida
- 2.2 Bloque de presentación de la empresa con texto e imagen
- 2.3 Valores en tarjetas
- 2.4 Equipo con fotos y breves biografías
- 2.5 CTA a contactar
- 2.6 Footer compartido
PROGRAM
- 3.1 Cabecera
- 3.2 Lista de programas en tarjetas, filtro por categoría
- 3.3 Detalle de programa: hero, descripción, beneficios, testimonio, formulario de inscripción
- 3.4 Footer
BLOG
- 4.1 Cabecera
- 4.2 Grid de artículos con imagen, título, extracto, fecha
- 4.3 Paginación
- 4.4 Footer
CONTACT
- 5.1 Cabecera
- 5.2 Formulario de contacto con campos nombre, email, mensaje
- 5.3 Mapa estático
- 5.4 Información de contacto y horarios
- 5.5 Footer
PROMPTS RELACIONADOS · EDUCACIÓN
