NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia "Aurelia Naturals" (dominio aurelia.com) usando solo un archivo HTML que incluya Tailwind CSS desde CDN y JavaScript vanilla. La web debe reproducir el diseño estructural y visual del sitio analizado: encabezado fijo con logo dual (modo claro/oscuro), menú hamburguesa que abre un panel lateral con texto descriptivo y enlaces a Shop, Journal, Store y About, y botón de carrito que despliega una barra lateral derecha con lista de productos, subtotales y checkout. La home contiene: hero a pantalla completa con fondo difuminado, bloque de valores con tipografía serif, cuadrícula 4‑col de productos destacados (imagen, nombre, precio, botón "Añadir"), carrusel de testimonios (fade simple), sección de suscripción al newsletter (campo email y botó
3.394 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.394 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 fijo con logo, menú hamburguesa, enlaces de navegación y botón de carrito lateral
- 1.2 Panel de menú lateral con texto introductorio y enlaces a Shop, Journal, Store, About
- 1.3 Hero principal con imagen a pantalla completa y llamado a la acción implícito
- 1.4 Bloque de valores con texto descriptivo sobre origen de los materiales
- 1.5 Cuadrícula de productos destacados (grid 4 columnas) con imágenes y nombres
- 1.6 Sección de testimonios en carrusel sencillo
- 1.7 Llamado a suscribirse al boletín con campo de captura de email
- 1.8 Pie de página con enlaces institucionales, redes sociales y derechos de autor
SHOP
- 1.1 Encabezado (igual que Home)
- 1.2 Lista de categorías en barra lateral
- 1.3 Cuadrícula de productos con filtros y botones "Añadir al carrito"
- 1.4 Paginación inferior
- 1.5 Pie de página
PRODUCT DETAIL
- 1.1 Encabezado
- 1.2 Galería de imágenes del producto con zoom
- 1.3 Información del producto: nombre, descripción, precio, selector de variantes
- 1.4 Botón "Añadir al carrito"
- 1.5 sección de productos relacionados en carrusel
- 1.6 Pie de página
CART
- 1.1 Encabezado de carrito lateral
- 1.2 Lista de artículos con miniatura, nombre, variante, cantidad y botón eliminar
- 1.3 Subtotal y botón "Continuar al checkout"
- 1.4 Mensaje de carrito vacío
- 1.5 Pie de página
CHECKOUT
- 1.1 Formulario de datos de envío
- 1.2 Resumen del pedido
- 1.3 Selección de método de pago (incluye Apple Pay y Google Pay mock)
- 1.4 Botón "Confirmar compra"
- 1.5 Pie de página
ABOUT
- 1.1 Encabezado
- 1.2 Texto narrativo sobre la historia y valores de la marca
- 1.3 Equipo con fotos en grid
- 1.4 Llamado a la acción para contactar
- 1.5 Pie de página
JOURNAL
- 1.1 Encabezado
- 1.2 Lista de artículos de blog en tarjetas con imagen, título y extracto
- 1.3 Barra lateral con categorías y suscripción al boletín
- 1.4 Paginación
- 1.5 Pie de página
PROMPTS RELACIONADOS · BELLEZA / SPA
