NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web estático usando solo HTML, Tailwind CSS CDN y JavaScript vanilla (un único archivo). La marca ficticia es SonoraHub (sonorahub.com) con el claim "Conecta ideas y voces en un solo espacio". Usa la paleta de colores basada en tonos oscuros y acentos vivos: #0A0A0A (fondo principal), #1F2937 (secciones), #3B82F6 (botón primario), #10B981 (botón secundario), #FFFFFF (texto) y #F59E0B (destacados). Tipografía: Inter (Google Fonts) para títulos y texto.
Estructura:
- Header fijo con logo sencillo (texto SonoraHub) y menú horizontal: Home, About, Episodes, Blog, Contact. Botón destacado "Start Listening" a la derecha.
- Hero: contenedor split 2 columnas. Izquierda: H1 "Transforma tus ideas en podcasts profesionales", párrafo descriptivo, botón primario "Start Listening" y secu
3.809 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.809 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 Cabecera con menú principal, logo y botón "Start Listening"
- 2.1 Hero: título grande, párrafo descriptivo, botones primario y secundario, imágenes decorativas y contador de oyentes
- 3.1 Área de marcas: fila de logotipos repetidos en carrusel estático
- 4.1 Episodios: encabezado, grid de tarjetas con imagen, título, descripción corta y botón reproducir
- 5.1 Footer: columnas de enlaces (Inicio, Sobre, Episodios, Blog, Contacto), redes sociales y datos legales
ABOUT
- 1.1 Cabecera reutilizada
- 2.1 Bloque de presentación de la empresa con imagen y texto
- 3.1 Equipo destacado en tarjetas
- 4.1 Valores o métricas en iconos
EPISODE
- 1.1 Cabecera
- 2.1 Lista de episodios en formato lista con reproductor y descripción
- 3.1 CTA para suscripción o descarga
BLOG
- 1.1 Cabecera
- 2.1 Lista de artículos en tarjetas estilo masonry
- 3.1 Sidebar con categorías y newsletter
CONTACT
- 1.1 Cabecera
- 2.1 Formulario de contacto con campos nombre, email, mensaje
- 3.1 Mapa estático y datos de ubicación
PROMPTS RELACIONADOS · BELLEZA / SPA
