NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web estático para la marca ficticia **Aula Brisa** (dominio aulabrisa.com) usando **HTML + Tailwind CSS CDN + JavaScript vanilla** en un solo archivo. El proyecto debe reproducir fielmente la arquitectura visual de una ONG benéfica con los siguientes requisitos:
- **Paleta de colores**: #1A3E5D (azul marino), #F5F5F5 (gris claro), #E63946 (rojo coral), #FFFFFF (blanco), #000000 (negro) y acentos #A8DADC (cian suave).
- **Tipografía**: `Inter` para encabezados y cuerpo, peso 400‑700, tamaños fluidos (responsive). Importar desde Google Fonts.
- **Header**: barra fija, fondo blanco, logo a la izquierda (placeholder), menú horizontal con enlaces Home, Quiénes somos, Programa, Causas, Blog, Donar. Botón destacado "Donar" con estilo primario (rojo coral) y efecto hover.
- **Hero**
3.890 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.890 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 fija con logo, menú y botón de donación
- 1.2 Hero principal con título, subtítulo, indicadores y botones secundarios
- 1.3 Botón de scroll hacia abajo
- 1.4 Sección "Quiénes somos" con título, descripción y estadísticas animadas
- 1.5 (Placeholder) Sección de causas destacadas
- 1.6 (Placeholder) Sección de programa
- 1.7 Footer con información de contacto y enlaces
ABOUT
- 1.1 Cabecera reutilizada
- 1.2 Bloque informativo de la organización
- 1.3 Estadísticas ampliadas
- 1.4 CTA a donación
PROGRAM
- 1.1 Cabecera reutilizada
- 1.2 Descripción del programa y beneficios
- 1.3 Lista de actividades con iconos
- 1.4 Botón de participación
CAUSES
- 1.1 Cabecera reutilizada
- 1.2 Galería de causas con tarjetas
- 1.3 Botón para cada causa que dirige a detalle
BLOG
- 1.1 Cabecera reutilizada
- 1.2 Lista de artículos con imágenes, título y extracto
- 1.3 Paginación simple
DONATE
- 1.1 Cabecera reutilizada
- 1.2 Formulario de donación con campos estándar
- 1.3 Opciones de monto rápido
- 1.4 Botón de envío
FOOTER
- 1.1 Enlaces institucionales, políticas y redes sociales
- 1.2 Información de contacto y suscripción al boletín
PROMPTS RELACIONADOS · EDUCACIÓN
