NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia "Belleza Lira" (café de especialidad, venta online). Usa exclusivamente HTML estático, Tailwind CSS vía CDN y JavaScript vanilla en un único archivo. El diseño debe replicar los patrones visuales y estructurales del sitio analizado:
- **Paleta de colores**: #3E2723 (marrón oscuro), #F5E1A4 (crema), #FFFFFF (blanco), #000000 (negro) con opacidad para overlays.
- **Tipografía**: encabezados con "Playfair Display", cuerpo con "Inter" (cargados desde Google Fonts).
- **Header**: barra fija con fondo blanco translúcido, logo a la izquierda, menú de navegación horizontal (Home, About us, Coffee, Locations, Blog, Contact), mega‑menu bajo "All pages" con dos columnas de enlaces, icono de búsqueda que despliega un overlay de búsqueda con campo
3.929 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.929 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 Header con logo, navegación principal y buscador
- 1.2 Hero full‑screen con imagen de fondo, título, descripción y botón "Shop coffee"
- 1.3 Grid de enlaces a categorías de café (Decaf, Filter, Espresso, Cold Brew, Single Origin, Signature Blends)
- 1.4 Footer con enlaces de sección, redes sociales y datos de contacto
ABOUT US
- 1.1 Header (reutilizado)
- 1.2 Bloque de presentación de la marca con imagen y texto descriptivo
- 1.3 Valores y misión en columnas
- 1.4 Footer
COFFEE
- 1.1 Header
- 1.2 Lista de productos con tarjetas de café (imagen, nombre, breve descripción, botón "Añadir al carrito")
- 1.3 Filtros de categoría lateral
- 1.4 Footer
CONTACT US
- 1.1 Header
- 1.2 Formulario de contacto (nombre, email, mensaje, botón enviar)
- 1.3 Mapa incrustado
- 1.4 Footer
PROMPTS RELACIONADOS · BEAUTY / SPA