NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web estático replicando el diseño visual y la estructura de la página analizada, pero usando una marca ficticia llamada **EcoSonic** (plataforma de podcasts). El proyecto debe estar contenido en un único archivo HTML que incluya TailwindCSS vía CDN y JavaScript vanilla (sin frameworks).
**Requisitos técnicos**
- Utiliza la CDN de Tailwind 3.x (`https://cdn.tailwindcss.com`).
- Todo el CSS debe aplicarse mediante clases de Tailwind; no añadas estilos en `<style>`.
- Usa JavaScript puro para interacciones: menú móvil hamburguesa, dropdown de "Pages", animación de contadores numéricos en el hero y apertura/cierre del carrito modal.
- El carrito es un modal simulado que muestra una lista vacía y botones de Checkout; no es necesario conectar a un backend.
- Implementa un preload
4.768 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.768 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 logo, enlaces (Home, About, Podcast, Pages dropdown), botón Suscríbete y carrito.
- 1.2 Banner hero: título grande, párrafo, botón primario "Learn More", botón secundario con icono de play, contador de métricas animado.
- 1.3 Bloque de características: tarjetas con icono, título y descripción.
- 1.4 Galería de episodios: miniaturas, título, duración y botón de reproducción.
- 1.5 Sponsors: logotipos en fila.
- 1.6 Blog preview: tarjetas con imagen, título, extracto y enlace.
- 1.7 Footer: secciones de Navegación, Información, Redes sociales y formulario de suscripción.
ABOUT
- 2.1 Encabezado interno con breadcrumb.
- 2.2 Texto descriptivo de la empresa y su misión.
- 2.3 Equipo: tarjetas con foto, nombre y cargo.
- 2.4 Valores en columnas.
PODCAST
- 3.1 Lista de episodios con filtros.
- 3.2 Reproductor destacado.
- 3.3 Categorías en sidebar.
BLOG
- 4.1 Lista de artículos en formato tarjeta.
- 4.2 Barra lateral con categorías y suscriptores.
CONTACT
- 5.1 Formulario de contacto con campos nombre, email, mensaje.
- 5.2 Mapa incrustado y datos de localización.
PRICE
- 6.1 Tabla comparativa de planes de suscripción.
- 6.2 CTA de compra para cada plan.
STYLE GUIDE
- 7.1 Paleta de colores, tipografías y componentes UI reutilizables.
- 7.2 Ejemplos de botones, formularios y tarjetas.
PROMPTS RELACIONADOS · COMERCIO ELECTRÓNICO
Otros prompts de la misma categoría
PROMPTComercio electrónico
Market Zenit
★★★★★ 1.110 descargas
GRATIS0€
PROMPTComercio electrónico
Lino & Cañamo
★★★★★ 1.338 descargas
GRATIS0€
PROMPTComercio electrónico
Store Austral
★★★★★ 3.147 descargas
GRATIS0€
GPT Image 2
PROMPTComercio electrónico
Línea Aurora
★★★★★ 1.700 descargas
GRATIS0€
GPT Image 2