NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia "Aula Sierra" (aulasierra.com) siguiendo los siguientes requisitos:
- Stack: HTML estático en un solo archivo, Tailwind CSS vía CDN, JavaScript vanilla (sin frameworks) también embebido.
- Paleta de colores: #1A1A1A (negro profundo), #FFFFFF (blanco), #E0E0E0 (gris claro), #B22222 (rojo borgoña) para acentos, #F5F5F5 (fondo gris muy claro).
- Tipografía: "Playfair Display" para títulos y encabezados, "Inter" para cuerpo de texto. Ambas cargadas desde Google Fonts.
- Header: barra de navegación fija, logo a la izquierda, menú con enlaces (Inicio, Sobre nosotros, Proyectos, Eventos, Contacto) y un botón de llamada a la acción "Únete a la comunidad" con estilo de borde y fondo rojo borgoña. Menú desplegable en escritorio para secciones con sub
4.340 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.340 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 Barra de navegación fija con logo, menú desplegable y botón de llamado a la comunidad
- 1.2 Hero principal con título, subtítulo y imagen de fondo
- 1.3 Galería de demos de páginas de inicio mostradas como tarjetas
- 1.4 Sección de rendimiento con indicadores de PageSpeed y Grade
- 1.5 Bloque de proyectos destacados en cuadrícula
- 1.6 Bloque de eventos próximos con tarjetas
- 1.7 Llamado a la acción para unirse a la comunidad
- 1.8 Footer con enlaces institucionales, redes sociales y datos de contacto
ABOUT US
- 2.1 Header compartido
- 2.2 Título de sección y texto descriptivo de la asociación
- 2.3 Galería de imágenes históricas
- 2.4 Equipo con tarjetas de miembros
- 2.5 Footer compartido
PROJECTS
- 3.1 Header compartido
- 3.2 Título y filtro de categorías
- 3.3 Cuadrícula de proyectos con tarjetas, imagen, nombre y breve descripción
- 3.4 Footer compartido
EVENTS
- 4.1 Header compartido
- 4.2 Calendario o listado de eventos con tarjetas de fecha, título y ubicación
- 4.3 Footer compartido
CONTACT US
- 5.1 Header compartido
- 5.2 Formulario de contacto con campos nombre, email, asunto y mensaje
- 5.3 Mapa incrustado
- 5.4 Footer compartido
PROMPTS RELACIONADOS · EDUCACIÓN
