NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia "Armonía Cobalto" (dominio: armoniacobalto.com) siguiendo el estilo visual y la estructura del sitio original analizado. Usa exclusivamente HTML estático en un único archivo, Tailwind CSS a través del CDN y JavaScript vanilla (sin frameworks) para animaciones simples.
- Paleta de colores: fondo #111111, negro profundo #000000, acentos #FF6B6B (rojo coral), #4ECCA3 (verde menta), textos #FFFFFF y gris #A0A0A0.
- Tipografía: "Inter" para títulos y "Roboto" para cuerpo, ambas importadas desde Google Fonts.
- Header: barra fija con logo (texto Armonía Cobalto en blanco), menú horizontal (Inicio, Episodios, Sobre, Contacto) y dropdown "Suscríbete" que muestra iconos de Spotify, SoundCloud, Google Podcasts, Apple Podcasts, Pocket Casts y Anchor.
3.693 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.693 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 logo, menú y dropdown de suscripción
- 1.2 Hero con título, subtítulo, botón de suscripción y enlaces a plataformas de streaming, acompañada de una imagen decorativa
- 1.3 Bloque de episodios recientes con título, texto descriptivo y botón "Ver todos"
- 1.4 Lista de episodios en tarjetas tipo grid, cada una con imagen de fondo, host, título, botón reproducir y número de episodio
- 1.5 Sección de clientes con título, descripción y fila de logotipos
- 1.6 Footer con enlaces de navegación, redes sociales y datos de contacto
EPISODES
- 2.1 Cabecera estándar (logo y menú)
- 2.2 Lista completa de episodios en formato grid similar al de la home
- 2.3 Footer idéntico al de la home
ABOUT
- 3.1 Cabecera estándar
- 3.2 Sección de presentación del podcast con foto y texto descriptivo
- 3.3 Equipo / anfitriones en cards
- 3.4 Footer
CONTACT
- 4.1 Cabecera estándar
- 4.2 Formulario de contacto simple (nombre, email, mensaje)
- 4.3 Información de contacto y enlaces sociales
- 4.4 Footer
PROMPTS RELACIONADOS · BEAUTY / SPA
