Carrito Iniciar sesión
TECNOLOGÍA · Claude Design · HTML

Amanecer Solidario — Prompt de diseño web para Claude AI

ONG dedicada a proyectos de ayuda humanitaria y desarrollo comunitario Conectar recursos y personas para generar cambios reales.

↓ Descargar PROMPT.md
+0
0 0
GRATIS 0€
Amanecer Solidario — vista previa
NUEVO PROMPT
PROMPT

Cópialo y pégalo en Claude Design

↓ Descargar PROMPT.md
Crea una página web completa para la ONG ficticia "Amanecer Solidario" (amanecersolidario.org) usando solo HTML estático, Tailwind CSS CDN y JavaScript vanilla en un único archivo. Reproduce fielmente la estructura visual y la experiencia de usuario del sitio analizado, sin copiar textos literales. **Stack**: `<html lang="es">` con `<script src="https://cdn.tailwindcss.com"></script>` y un pequeño script al final para el carrusel y el lightbox del video. **Paleta de colores**: - Primario: #1A3A5A (azul marino profundo) - Secundario: #F7F7F7 (gris muy claro) - Accent: #E56B6F (rojo coral) - Texto principal: #1F2D3D - Texto secundario: #4A5568 **Tipografía**: - Headings: "Inter", sans-serif (peso 700) - Body: "Inter", sans-serif (peso 400) **Header**: barra fija con logo a la
4.746 caracteres · solo descargable completo ↓ Descargar PROMPT.md completo
4.746 caracteres · licencia libre Solo descarga completa disponible
CLAUDE DESIGN

Convierte este prompt en diseño real

Instala Claude Design, pega el prompt y ve la interfaz cobrar forma al instante.

Instalar Claude Design ↗
CAPTURA COMPLETA · HOME
Amanecer Solidario — home completa
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, botón de donación y menú móvil
  • 1.2 Hero con título, descripción, imagen de fondo y botón modal de video
  • 1.3 Bloque "Quiénes somos" con tag, título y texto introductorio
  • 1.4 Lista de valores en filas numeradas con íconos
  • 1.5 Sección de campañas en carrusel con tarjetas de campaña
  • 1.6 Footer con enlaces institucionales, contacto y redes sociales

ABOUT

  • 2.1 Header heredado
  • 2.2 Hero secundario con imagen y mensaje institucional
  • 2.3 Texto largo sobre la historia y misión
  • 2.4 Equipo y voluntarios en grid
  • 2.5 CTA para unirse o donar

PROGRAMS

  • 3.1 Header
  • 3.2 Galería de programas con tarjetas descriptivas
  • 3.3 Estadísticas de impacto en contador
  • 3.4 Botón para ver más detalles

BLOG

  • 4.1 Header
  • 4.2 Lista de artículos en formato tarjeta
  • 4.3 Sidebar con categorías y últimas noticias
  • 4.4 CTA para suscripción al boletín

CAMPAIGNS

  • 5.1 Header
  • 5.2 Grid de campañas con filtros por tema
  • 5.3 Detalle de campaña con imágenes, meta y botón de donar

VOLUNTEERS

  • 6.1 Header
  • 6.2 Formulario de inscripción voluntaria
  • 6.3 Testimonios de voluntarios en carrusel

DONATION

  • 7.1 Header
  • 7.2 Formulario de donación único con opciones de monto
  • 7.3 Información de seguridad y agradecimiento

CONTACT

  • 8.1 Header
  • 8.2 Formulario de contacto y mapa incrustado
  • 8.3 Información de oficina y horarios

FAQ

  • 9.1 Header
  • 9.2 Preguntas frecuentes en acordeón
  • 9.3 CTA para contactar si no se resuelve la duda
Imagen generada con OpenRouter · Nano Banana (Gemini 2.5 Flash Image) · google/gemini-2.5-flash-image · 11/07/2026
PROMPTS RELACIONADOS · TECNOLOGÍA

Otros prompts de la misma categoría