NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia Compras Lira, plataforma de venta y contenidos para músicos y estudios de grabación. Usa HTML estático en un solo archivo, Tailwind CSS vía CDN y JavaScript vanilla para interactividad (menú desplegable, carrito lateral). Mantén la siguiente paleta de colores: #1A1A1A (fondo oscuro), #F5F5F5 (texto claro), #FF6B6B (accento rojo), #2ECC71 (verde activo), #FFFFFF (blanco). Tipografía: Inter para títulos y cuerpo, tamaños 4xl‑lg‑base.
Estructura:
- <header class="fixed top-0 w-full bg-[#1A1A1A] text-[#F5F5F5] shadow-md"> contiene logo (SVG simple), menú hamburguesa que abre un dropdown multi‑columna con secciones "Multi‑Layout", "Static", "CMS", "Template" y enlaces a redes sociales. A la derecha, botón de carrito con contador.
- <section
4.087 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.087 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ú desplegable multi‑columnas y botón de carrito
- 1.2 Hero con imagen destacada y botón de compra de plantilla
- 1.3 Enlaces principales de navegación secundaria (Music, About, Studio, News, Contact)
- 1.4 Área de carrito lateral ocultable
- 1.5 Footer con enlaces de información y redes sociales
MUSIC
- 2.1 Cabecera con título de sección y filtro de géneros
- 2.2 Grid de tarjetas de álbumes o pistas con imagen, título y botón de agregar al carrito
ABOUT
- 3.1 Imagen de cabecera con texto descriptivo
- 3.2 Sección de historia con bloques de texto y fotos
STUDIO
- 4.1 Lista de servicios del estudio con iconos y descripción corta
- 4.2 Testimonios en carrusel
NEWS
- 5.1 Lista de artículos recientes con imagen, título y extracto
- 5.2 Paginación simple
CONTACT
- 6.1 Formulario de contacto con campos nombre, email, mensaje y botón enviar
- 6.2 Información de contacto y mapa embebido
PROMPTS RELACIONADOS · E-COMMERCE
