NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia Armonía Helio (armoniahelio.com) que reproduzca el diseño visual y la estructura de la plantilla analizada. Usa HTML5 y Tailwind CSS vía CDN, con todo el CSS e interacciones en un único archivo. Incluye JavaScript vanilla para:
- abrir/cerrar el menú hamburguesa lateral con animación de overlay;
- actualizar el contador del carrito cuando se añaden productos (simulado);
- desplazar suavemente a secciones al hacer click en los enlaces del menú.
Paleta de colores: #111111 (texto principal), #FFFFFF (fondo), #F4F4F4 (gris claro), #FF6600 (acento), #333333 (cabecera). Tipografía: "Inter" para títulos (peso 700) y "Roboto" para cuerpo (peso 400).
Estructura:
Header: logo a la izquierda, iconos sociales (Twitter, Facebook, Dribbble, LinkedIn
3.478 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.478 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 Encabezado con logo, menú hamburguesa y carrito
- 1.2 Menú lateral con enlaces numerados
- 1.3 Hero principal con imagen de fondo y llamado a la acción
- 1.4 Bloque de ventajas con iconos y texto breve
- 1.5 Galería de productos en cuadrícula responsiva
- 1.6 Testimonios en carrusel simple
- 1.7 Sección de suscripción al boletín
- 1.8 Pie de página con enlaces, redes sociales y copyright
ABOUT
- 2.1 Encabezado idéntico al home
- 2.2 Imagen de cabecera con texto descriptivo
- 2.3 Historia de la marca en dos columnas
- 2.4 Equipo con fotos circulares
- 2.5 Valores en tarjetas
- 2.6 Footer común
NEWS
- 3.1 Encabezado estándar
- 3.2 Lista de artículos en tarjetas con imagen, título y extracto
- 3.3 Sidebar con categorías y búsqueda
- 3.4 Footer común
CONTACT
- 4.1 Encabezado estándar
- 4.2 Formulario de contacto con campos nombre, email, mensaje
- 4.3 Mapa incrustado
- 4.4 Información de contacto y redes
- 4.5 Footer común
PROMPTS RELACIONADOS · BEAUTY / SPA
