
NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia **Alma Solidaria** (almasolidaria.org), una ONG sin ánimo de lucro que combate el hambre. Usa solo HTML estático en un único archivo, Tailwind CSS a través del CDN y JavaScript vanilla (sin frameworks). Reproduce fielmente la estructura y los patrones visuales del sitio original:
- **Paleta de colores**: verde profundo #1B4332, azul suave #4A90E2, gris claro #F5F5F5, blanco #FFFFFF, acento naranja #E07A5F.
- **Tipografía**: headings con "Playfair Display" (serif), cuerpo con "Inter" (sans‑serif).
- **Header**: barra fija, logo a la izquierda, menú horizontal (Home, Sobre, Causas, Voluntariado, Blog, Contacto) con separadores de punto, botón de llamada a la acción “Donar ahora” destacado en naranja, versión hamburguesa en móvil.
- **H
4.047 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.047 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ú principal y botón de donación
- 1.2 Hero con título, subtítulo, botón principal y video de fondo
- 1.3 Bloque de estadísticas (contadores)
- 1.4 Sección de causas destacadas en tarjetas
- 1.5 Área de testimonios en carrusel
- 1.6 Llamada a la acción al boletín
- 1.7 Footer con enlaces y datos de contacto
ABOUT US
- 2.1 Header (reutilizado)
- 2.2 Imagen hero con texto institucional
- 2.3 Historia de la organización en dos columnas
- 2.4 Equipo con fotos y breves bios
- 2.5 Footer (reutilizado)
CAUSES
- 3.1 Header
- 3.2 Lista de causas en tarjetas con imagen, resumen y botón “Leer más”
- 3.3 Filtro por categoría
- 3.4 Footer
VOLUNTEER
- 4.1 Header
- 4.2 Formulario de inscripción al voluntariado
- 4.3 Beneficios de ser voluntario en lista
- 4.4 Footer
DONATE
- 5.1 Header
- 5.2 Formulario de donación con monto personalizable y método de pago
- 5.3 Testimonios de donantes
- 5.4 Footer
BLOG
- 6.1 Header
- 6.2 Grid de artículos con imagen, título y extracto
- 6.3 Barra lateral con categorías y últimos posts
- 6.4 Footer
CONTACT
- 7.1 Header
- 7.2 Formulario de contacto y mapa embebido
- 7.3 Información de contacto y horario
- 7.4 Footer
PROMPTS RELACIONADOS · SIN FINES DE LUCRO
