NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web estático en un solo archivo HTML que reproduzca el diseño de una universidad moderna, usando la marca ficticia "Campus Online Alba". Utiliza Tailwind CSS vía CDN y JavaScript vanilla para interactividad (menús dropdown, carrusel de testimonios y carrito modal). Paleta de colores: #1E3A8A (azul principal), #F3F4F6 (gris claro fondo), #111827 (texto oscuro), #10B981 (verde acento), #FFFFFF (blanco). Tipografías: "Inter" para cuerpo y "Playfair Display" para encabezados, ambas importadas de Google Fonts.
Estructura:
- **Header**: barra fija con logo a la izquierda, menú de navegación horizontal (Home, Sobre Nosotros, Programas, Profesores, Eventos, Blog, Contacto), elemento dropdown "Páginas" con enlaces internos, y botón de carrito que abre modal con lista de productos y s
4.004 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.004 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 con logo, menú, dropdown y carrito
- 1.2 Hero con título, subtítulo y botón CTA
- 1.3 Grid de programas académicos
- 1.4 Grid de profesores destacados
- 1.5 Lista de eventos próximos
- 1.6 Carrusel de testimonios
- 1.7 Suscripción al boletín
- 1.8 Footer institucional
ABOUT US
- 1.1 Header
- 1.2 Banner interior con título
- 1.3 Texto descriptivo de la institución
- 1.4 Misión, Visión y Valores en columnas
- 1.5 Equipo directivo en cards
- 1.6 Footer
PROGRAMS
- 1.1 Header
- 1.2 Lista de programas con filtro y paginación
- 1.3 Cada programa con imagen, info breve y botón "Más"
- 1.4 Footer
TEACHERS
- 1.1 Header
- 1.2 Grid de docentes con foto, nombre, área y botón "Perfil"
- 1.3 Footer
EVENTS
- 1.1 Header
- 1.2 Calendario de eventos con cards de detalle
- 1.3 Footer
BLOG
- 1.1 Header
- 1.2 Lista de artículos con miniatura, título y extracto
- 1.3 Sidebar con categorías y últimos posts
- 1.4 Footer
CONTACT
- 1.1 Header
- 1.2 Formulario de contacto (nombre, email, mensaje)
- 1.3 Mapa incrustado
- 1.4 Footer
PROMPTS RELACIONADOS · LMS / ONLINE COURSES
