NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia "Sistemas Andina" (sistemasandina.com), una ONG sin ánimo de lucro. Usa únicamente HTML, TailwindCSS vía CDN y JavaScript vanilla en un solo archivo.
**Paleta de colores**: Primary #2C3E50, Accent #E74C3C, Light #F5F5F5, Dark #0A0A0A, White #FFFFFF.
**Tipografía**: fuente principal "Inter" desde Google Fonts, peso 400 y 600.
**Header**: barra superior fija con fondo Light, incluye mensaje “¡Ayúdanos a cambiar vidas!”, enlace a página de voluntariado y datos de contacto (email info@sistemasandina.com, teléfono +34 123 456 789). Debajo, barra de navegación con logo (texto "Sistemas Andina" en Primary), menú Home, About, Causes, Events, Blog, Contact y botón destacado "Donar ahora" en Accent.
**Footer**: fondo Dark, cuatro columnas: 1) Lo
4.238 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.238 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 superior con enlace a voluntariado y datos de contacto
- 1.2 Menú de navegación principal con botón "Donar ahora"
- 1.3 Hero con título, subtítulo y botones de acción
- 1.4 Animación de imágenes rotativas que ilustra la labor de la organización
- 1.5 Cuadro de estadísticas con contadores animados
- 1.6 Sección de causas destacadas en tarjetas de tres columnas
- 1.7 Área de eventos próximos con listado resumido
- 1.8 Llamada a la acción para suscribirse al boletín
- 1.9 Footer con enlaces institucionales, datos de contacto y redes sociales
ABOUT
- 2.1 Encabezado con foto hero y texto institucional
- 2.2 Historia de la organización en bloques de texto e imágenes
- 2.3 Equipo con tarjetas de perfil
- 2.4 Valores y misión en iconos
- 2.5 Footer
CAUSES
- 3.1 Listado de causas en rejilla de tarjetas
- 3.2 Filtros por categoría
- 3.3 Botón para aportar a cada causa
- 3.4 Footer
EVENTS
- 4.1 Calendario de eventos destacando próximos
- 4.2 Tarjetas de evento con foto, fecha y botón registrar
- 4.3 Footer
DONATE
- 5.1 Formulario de donación rápido con importe predefinido
- 5.2 Opciones de pago y mensaje de agradecimiento
- 5.3 Footer
VOLUNTEER
- 6.1 Formulario de solicitud de voluntariado
- 6.2 Información de beneficios y requisitos
- 6.3 Footer
BLOG
- 7.1 Lista de artículos con imagen, título y extracto
- 7.2 Paginación y barra lateral de categorías
- 7.3 Footer
CONTACT
- 8.1 Formulario de contacto con mapa incrustado
- 8.2 Información de oficina y teléfono
- 8.3 Footer
PROMPTS RELACIONADOS · TECNOLOGÍA