NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia Compras Éter (compraseter.com) usando solo HTML, Tailwind CSS CDN y JavaScript vanilla en un único archivo. La web es un comercio electrónico para músicos, debe incluir:
- Paleta de colores: #0D0D0D (fondo negro), #E50914 (rojo vibrante), #FFFFFF (blanco), #555555 (gris medio) y #F5F5F5 (gris claro).
- Tipografía: "Inter" para títulos y cuerpo, cargada desde Google Fonts.
- Header fijo con logo a la izquierda, menú horizontal (Home, About, Shows, Merch, Blog, Contact), dropdown "Pages" con enlaces internos, botón de carrito que abre un sidebar a la derecha mostrando items, cantidad y checkout.
- Hero de la página Home: fondo oscuro con overlay rojo, título grande en Inter Bold, subtítulo y botón primary "Explora Merch".
- Sección "Nuestra b
3.788 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.788 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ú principal, dropdown y botón de carrito lateral
- 1.2 Hero de página principal con fondo oscuro, título destacado y llamado a acción
- 1.3 Sección de presentación de la banda con texto y foto
- 1.4 Galería de álbumes en cuadrícula con botones de compra
- 1.5 Calendario de próximos shows con tarjetas y botón "Ver más"
- 1.6 Testimonios en carrusel lateral
- 1.7 Suscripción al boletín con formulario simple
- 1.8 Footer con enlaces de navegación, redes sociales y datos de contacto
ABOUT
- 2.1 Encabezado (reutiliza del HOME)
- 2.2 Hero interno con imagen del grupo y subtítulo
- 2.3 Historia de la banda en dos columnas con imágenes
- 2.4 Equipo / integrantes con foto y rol
- 2.5 CTA a tienda y calendario
- 2.6 Footer
MERCH
- 3.1 Encabezado
- 3.2 Hero de colección con título y filtro de categorías
- 3.3 Grid de productos: imagen, nombre, precio, botón "Añadir al carrito"
- 3.4 Paginación
- 3.5 Footer
EVENTS
- 4.1 Encabezado
- 4.2 Hero de eventos con fecha destacada
- 4.3 Lista de conciertos: tarjeta con fecha, ciudad, venue, botón "Detalles"
- 4.4 Mapa incrustado de ubicación
- 4.5 Footer
BLOG
- 5.1 Encabezado
- 5.2 Lista de artículos en formato tarjeta con imagen, título, extracto, botón "Leer más"
- 5.3 Sidebar con categorías y últimos posts
- 5.4 Footer
CONTACT
- 6.1 Encabezado
- 6.2 Formulario de contacto: nombre, email, mensaje, botón enviar
- 6.3 Información de contacto y mapa
- 6.4 Footer
PROMPTS RELACIONADOS · COMERCIO ELECTRÓNICO