NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia "Campus Atlas" (plataforma de streaming y producción de contenidos audiovisuales) usando únicamente HTML, Tailwind CSS vía CDN y JavaScript vanilla en un solo archivo. Reproduce fielmente la estructura y estilo del sitio analizado:
- Paleta de colores: fondo negro profundo #0D0E0F, acentos azul brillante #1E90FF, texto principal blanco #FFFFFF, gris neutro #F5F5F5.
- Tipografía: "Inter" para títulos y textos, importada desde Google Fonts.
- Header: barra de navegación fija, logo a la izquierda, enlaces Home, About, Work, dropdown "Pages" con Team, Blog, Contact, y botón destacado "Get Started" con efecto hover. Menú colapsable en móvil.
- Hero: sección a pantalla completa con video de fondo autoplay loop muted, overlay oscuro, columna
4.012 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.012 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 botón CTA
- 1.2 Hero con título, subtítulo, descripción, botón y video de fondo
- 1.3 Bloque "Sobre nosotros" con texto y overlays
- 1.4 Sección Live Broadcast con imagen, título y descripción
- 1.5 Sección Visual Archive con video incorporado y controles
- 1.6 Sección Sound Cloud con imagen y descripción
- 1.7 Marquee animado con texto repetido y video de fondo
- 1.8 Footer con enlaces y datos de contacto
ABOUT
- 2.1 Cabecera compartida
- 2.2 Imagen de encabezado y texto introductorio
- 2.3 Equipo destacado
- 2.4 Valores y misión
WORK
- 3.1 Cabecera compartida
- 3.2 Galería de proyectos en cuadrícula
- 3.3 Testimonios rotativos
- 3.4 Llamada a la acción de contacto
BLOG
- 4.1 Cabecera compartida
- 4.2 Lista de artículos con imagen, título y extracto
- 4.3 Barra lateral con categorías y últimos posts
CONTACT
- 5.1 Cabecera compartida
- 5.2 Formulario de contacto simple
- 5.3 Información de ubicación y redes sociales
PROMPTS RELACIONADOS · EDUCATION
