NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo llamado **Comunidad Viva** (comunidadviva.com) con el siguiente alcance y stack: HTML estático, Tailwind CSS vía CDN y JavaScript vanilla en un único archivo. Reproduce fielmente la estructura y patrones visuales del HTML analizado, sin copiar texto literal. Utiliza la paleta de colores basada en los tonos presentes en la plantilla original (azul profundo #0A3D62, azul claro #4A90E2, blanco #FFFFFF, gris neutro #F5F5F5 y acento naranja #F5A623). La tipografía principal será "Inter" para encabezados y "Open Sans" para cuerpo, cargadas desde Google Fonts.
### HEADER
- Barra de navegación fija, logo a la izquierda (imagen placeholder).
- Menú principal con enlaces: Home, Sobre nosotros, Eventos, Directorio, Páginas (dropdown con Galería, Blog, Contacto, 404), Dona
5.265 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
5.265 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ú principal, dropdown y botón "Únete a la comunidad"
- 2.1 Hero: subtítulo, títulos fragmentados, tres imágenes en bucle
- 3.1 Visión: círculo con enlace, video de fondo, contador de estadísticas, botón secundario "Donar ahora"
- 4.1 Footer: logo, enlaces de secciones, íconos de redes, texto legal
ABOUT
- 1.1 Cabecera (reutilizada)
- 2.1 Banner interno con título "Sobre nosotros"
- 3.1 Texto descriptivo y foto del equipo
- 4.1 Footer
EVENTS
- 1.1 Cabecera
- 2.1 Lista de eventos en tarjetas con imagen, fecha y botón "Más info"
- 3.1 Sección de registro rápido
- 4.1 Footer
DIRECTORY
- 1.1 Cabecera
- 2.1 Grid de directorio con categorías y filtros
- 3.1 Mapa incrustado
- 4.1 Footer
GALLERY
- 1.1 Cabecera
- 2.1 Galería de imágenes tipo mosaico con efecto hover
- 3.1 Lightbox modal
- 4.1 Footer
BLOG
- 1.1 Cabecera
- 2.1 Lista de artículos con cards, autor y fecha
- 3.1 Paginación simple
- 4.1 Footer
CONTACT
- 1.1 Cabecera
- 2.1 Formulario de contacto con campos nombre, email, mensaje
- 3.1 Mapa de ubicación
- 4.1 Footer
DONATE
- 1.1 Cabecera
- 2.1 Información de causa y formulario de donación
- 3.1 Testimonios en carrusel
- 4.1 Footer
PROMPTS RELACIONADOS · BEAUTY / SPA
