NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crear una página web completa para la marca ficticia **Belleza Lumen** (tienda online de cosmética) usando **HTML** + **Tailwind CSS CDN** + **JavaScript vanilla** en un solo archivo. Reproducir fielmente la estructura y estilo del sitio analizado:
- **Paleta de colores**: #1A1A1A (negro profundo), #FF6F91 (rosa vibrante), #F5F5F5 (gris muy claro), #FFFFFF (blanco), #EDEDED (gris suave) para fondos y bordes.
- **Tipografía**: `Inter` para textos y `Playfair Display` para encabezados, ambas importadas desde Google Fonts.
- **Header**: barra fija con logo a la izquierda, menú horizontal (Home, Shop, About, Contact) con dropdown de "Pages", icono de búsqueda que despliega un overlay, icono de carrito que muestra un modal con contenido del carrito. Menú colapsable en móvil.
- **Hero**: secció
4.634 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.634 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, buscador y carrito
- 2.1 Hero con imagen de fondo, título, subtítulo y botón "Comprar ahora"
- 3.1 Bloque de categorías (3 columnas) con iconos y textos
- 4.1 Grid de productos destacados (4 columnas) con imagen, nombre, precio y botón
- 5.1 Testimonios en carrusel (3 tarjetas)
- 6.1 Newsletter (campo email + botón suscribirse)
- 7.1 Footer con columnas de enlaces, redes sociales y datos de contacto
SHOP
- 1.1 Header (igual que home)
- 2.1 Barra de filtros y ordenación
- 3.1 Grid de productos (paginado)
- 4.1 Footer
PRODUCT DETAILS
- 1.1 Header
- 2.1 Imagen principal del producto con galería de miniaturas
- 3.1 Información del producto (título, descripción, precio, selector de variante, botón añadir al carrito)
- 4.1 Productos relacionados (grid)
- 5.1 Footer
ABOUT
- 1.1 Header
- 2.1 Sección de historia con imagen y texto
- 3.1 Equipo (tarjetas con foto y nombre)
- 4.1 Valores (iconos + textos)
- 5.1 Footer
CONTACT
- 1.1 Header
- 2.1 Formulario de contacto (nombre, email, mensaje, botón enviar)
- 3.1 Mapa incrustado
- 4.1 Footer
CART
- 1.1 Header
- 2.1 Lista de productos en el carrito con miniatura, nombre, precio, cantidad y botón eliminar
- 3.1 Resumen del pedido (subtotal, botones de checkout)
- 4.1 Footer
PROMPTS RELACIONADOS · BEAUTY / SPA
