NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia **Armonía Rubí** (tienda de cosmética online) usando **HTML único, Tailwind CSS vía CDN y JavaScript vanilla** en un solo archivo. Replicar el diseño analizado:
- **Paleta de colores**: #1A1A1A (negro profundo), #FFFFFF (blanco), #E0B0FF (lavanda suave), #F5F5F5 (gris claro), #D4A5A5 (rosa empolvado).
- **Tipografía**: `Inter` para textos y `Playfair Display` para títulos, importados desde Google Fonts.
- **Header**: barra superior fija con mensaje “Sophistication Meets Uncompromised Elegance”, buscador, enlaces a "Find a store", iconos de usuario y carrito con contador. Debajo, navbar con logo SVG, enlaces "About", "Categories", "Shop", "Blogs", dropdown "Resources" con enlaces internos y enlace "Contact". Versión móvil con menú hamburg
4.417 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.417 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 Barra superior con mensaje, buscador, enlaces a tienda, usuario y carrito
- 1.2 Menú de navegación principal con logo, enlaces y dropdown de recursos
- 1.3 Hero principal con imagen de fondo, título destacado y llamado a la acción
- 1.4 Grid de categorías destacadas con tarjetas interactivas
- 1.5 Sección de productos destacados en carrusel
- 1.6 Testimonios de clientes en formato slider
- 1.7 Blog preview con tarjetas de artículos recientes
- 1.8 Newsletter signup con formulario compacto
- 1.9 Footer con enlaces institucionales, redes sociales y datos de contacto
ABOUT US
- 2.1 Imagen de cabecera con título "Sobre Lúmina"
- 2.2 Texto descriptivo de la marca y misión
- 2.3 Equipo con fotos y breves biografías
- 2.4 Valores y compromiso con la sostenibilidad
- 2.5 CTA a la tienda
SHOP
- 3.1 Filtros lateral izquierdo (categorías, precios, marcas)
- 3.2 Grid de productos con foto, nombre, precio y botón "Añadir"
- 3.3 Paginación inferior
- 3.4 Sidebar de ofertas rápidas
PRODUCT DETAIL
- 4.1 Galería de imágenes del producto con zoom
- 4.2 Información del producto: nombre, precio, descripción, selector de cantidad
- 4.3 Botón "Añadir al carrito"
- 4.4 Reseñas de clientes y puntuación
CART
- 5.1 Lista de productos en el carrito con miniaturas, qty y precio
- 5.2 Subtotal y botones "Continuar comprando" y "Ir a pagar"
CHECKOUT
- 6.1 Formulario de datos de envío
- 6.2 Opciones de método de pago
- 6.3 Resumen del pedido y botón "Confirmar compra"
BLOG
- 7.1 Lista de artículos en tarjetas con imagen, título y extracto
- 7.2 Barra lateral con categorías y últimos posts
- 7.3 Paginación
CONTACT US
- 8.1 Formulario de contacto con nombre, email, asunto y mensaje
- 8.2 Mapa incrustado y datos de dirección
- 8.3 Horario y redes sociales
PROMPTS RELACIONADOS · BELLEZA / SPA
