NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web estática (HTML único) usando Tailwind CSS vía CDN y JavaScript vanilla que reproduzca el diseño de una tienda online para músicos bajo la marca ficticia "Store Brisa". La web debe contener:
- Paleta de colores: fondo #0A0A0A (negro profundo), texto principal #F5F5F5 (blanco humo), acentos #E63946 (rojo vibrante) y #1D3557 (azul marino); usa variables CSS personalizadas.
- Tipografía: "Inter" para cuerpo y "Playfair Display" para encabezados, importadas de Google Fonts.
- Header: barra fija con logo (SVG placeholder), menú hamburguesa que despliega enlaces (Música, Banda, Eventos, Noticias, Tienda, Contacto), botón de carrito que abre una sidebar izquierda con lista de productos, cantidades editables y totales. El logo cambia a versión negra/blanca según scroll.
- Hero:
3.942 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.942 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 de navegación fija con logo, menú hamburguesa, enlaces principales y botón de carrito lateral
- 1.2 Hero de página principal con fondo oscuro, título destacado y botón de acción
- 1.3 Sección "Música" con galería de tracks y reproductor placeholder
- 1.4 Sección "Eventos" con listado de próximos shows en tarjetas
- 1.5 Sección "Noticias" con tarjetas de blog recientes
- 1.6 Sección "Tienda" con grid de productos destacados
- 1.7 Footer con información de contacto, enlaces rápidos y redes sociales
MUSIC
- 1.1 Título de la página y filtro de géneros
- 1.2 Lista de tracks en tarjetas con portada, botón reproducir y enlace a detalle
- 1.3 Paginación o carga progresiva
BAND
- 1.1 Presentación de la banda con foto hero y biografía corta
- 1.2 Membresías y fotos del equipo
- 1.3 Botón para seguir en redes
EVENTS
- 1.1 Calendario de eventos con tarjetas de fecha, ciudad y enlace a compra
- 1.2 Mapa incrustado y sección de newsletter
NEWS
- 1.1 Lista de artículos con imágenes, título y extracto
- 1.2 Categorías y barra de búsqueda
STORE
- 1.1 Grid de productos con imagen, nombre, precio y botón "Añadir"
- 1.2 Filtros por categoría y barra de búsqueda
CONTACT
- 1.1 Formulario de contacto simple con campos nombre, email, mensaje
- 1.2 Información de ubicación y enlaces a redes sociales
CART
- 1.1 Panel lateral izquierdo con lista de productos, cantidades y total
- 1.2 Botones de "Continuar compra" y "Pagar"
PROMPTS RELACIONADOS · COMERCIO ELECTRÓNICO