NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia **Instituto Boreal** (dominio institutoboreal.com) usando **HTML** puro, **Tailwind CSS CDN** y **JavaScript vanilla** en un solo archivo. Replicar el diseño visual y la estructura del sitio original (plantilla teatral) sin copiar textos ni imágenes. Utiliza los siguientes recursos:
- **Paleta de colores**: #111111 (fondo oscuro), #F5C041 (dorado/acento), #FFFFFF (blanco), #CCCCCC (gris claro).
- **Tipografía**: Inter (Google Fonts) para todo el cuerpo, con peso 400/600; display "Playfair Display" para títulos.
- **Header**: barra fija con logo a la izquierda, menú mega‑dropdown con columnas (Home, Demos, About Us, Events, News, All Pages) y botón destacado “Get Tickets” con efecto de clipping (texto que se revela al hover). Añadir icono
3.696 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.696 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 Header fijo con logo, menú mega‑dropdown y botón "Get Tickets"
- 2.1 Hero principal con título, subtítulo y grid de tres imágenes de portada
- 3.1 Sección de fondo gradiente con imagen decorativa
- 4.1 Bloque de testimonios de clientes con encabezado y párrafo
- 5.1 Footer con enlaces institucionales, políticas y redes sociales
ABOUT US
- 1.1 Header igual que Home
- 2.1 Hero con título “Quienes somos” y texto descriptivo
- 3.1 Línea de tiempo de la historia
- 4.1 Equipo y actores destacados en tarjetas
- 5.1 Footer
EVENTS
- 1.1 Header
- 2.1 Lista de eventos en grid con tarjetas de imagen, fecha y botón "Ver detalle"
- 3.1 Sección destacada con evento principal y cuenta regresiva
- 4.1 Testimonios de asistentes
- 5.1 Footer
NEWS
- 1.1 Header
- 2.1 Blog listado con tarjetas de imagen, título y extracto
- 3.1 Sidebar con categorías y últimas noticias
- 4.1 Newsletter subscription form
- 5.1 Footer
PROMPTS RELACIONADOS · EDUCATION