NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia "LuzSolidaria" (organización sin ánimo de lucro). Utiliza exclusivamente HTML, Tailwind CSS vía CDN y JavaScript vanilla en un único archivo. Sigue estas especificaciones:
- **Paleta de colores**: #1A3A5F (azul oscuro), #2E5E8A (azul medio), #4A90E2 (azul brillante), #F5F7FA (gris claro), #FFFFFF (blanco).
- **Tipografía**: Inter (Google Fonts) para todo el texto, usar tamaños rem escalados, peso 400‑600.
- **Header**: barra fija con logo (SVG placeholder), menú de navegación horizontal con enlaces: "Demos", "Sobre Nosotros", "Programas", "Historias de Éxito", "Todas las páginas" (mega‑menú con tres columnas y enlaces internos), botón primario "Contactar". Versión móvil con botón hamburguesa que despliega el menú.
- **Hero**: sección ocu
3.809 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.809 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 con logo, enlaces a Demos, About Us, Programs, Success Stories y menú mega‑páginas, botón Contactar
- 1.2 Hero: título principal, subtítulo descriptivo, botón de acción, zona de imágenes que simula un carrusel de diferentes home
- 1.3 Sección "Clientes confían en nosotros": encabezado, párrafo introductorio y fondo de color contrastante
- 1.4 (Otros bloques que puedan existir bajo la sección de clientes, como logos o testimonios)
ABOUT US
- 2.1 Barra de navegación (heredada)
- 2.2 Cabecera con título y descripción de la misión
- 2.3 Galería de imágenes de impacto
- 2.4 Equipo y valores
PROGRAMS
- 3.1 Barra de navegación
- 3.2 Listado de programas con tarjetas y botones "Leer más"
- 3.3 Estadísticas de impacto
SUCCESS STORIES
- 4.1 Barra de navegación
- 4.2 Grid de historias de éxito con imagen, título y breve resumen
- 4.3 Llamada a la acción para donar o participar
CONTACT US
- 5.1 Barra de navegación
- 5.2 Formulario de contacto con campos nombre, email, mensaje
- 5.3 Información de contacto y mapa integrado
FOOTER
- En todas las páginas: sección de pie de página con logo, enlaces institucionales, redes sociales y datos de copyright
PROMPTS RELACIONADOS · MISCELÁNEO
