NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web estático usando HTML5, Tailwind CSS vía CDN y JavaScript vanilla en un único archivo. La marca ficticia es ConectaIdeas (conectaideas.com). Reproduce la estructura y estilo visual del sitio analizado sin copiar texto ni imágenes originales. Usa la siguiente paleta de colores: #1F2937 (gris oscuro), #3B82F6 (azul primario), #F9FAFB (gris muy claro), #6B7280 (gris medio), #FFFFFF (blanco). Tipografía: Inter para títulos y texto, peso 400‑700, importada desde Google Fonts.
**Header**: barra fija con fondo blanco, sombra ligera, logo (texto ConectaIdeas) a la izquierda y menú horizontal a la derecha con enlaces Home, Blogs, Podcasts, Contacto. En móvil, colapsa a un ícono de hamburguesa que despliega el menú.
**Home**:
1. Hero: contenedor centrado, título grande (h1) "Blog
4.561 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.561 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 y menú de navegación
- 1.2 Hero principal con título y grid de tarjetas destacadas del artículo principal
- 1.3 Lista de artículos en formato de columnas horizontales
- 1.4 Botón "Browse All Blogs"
- 1.5 Sección de suscripción al boletín con formulario
- 1.6 Título "Latest Podcast" y grid de podcasts con botón de reproducción
- 1.7 Botón "Browse All Podcasts"
- 1.8 Separador visual
- 1.9 Bloque de partnership con texto y logo de partners
- 1.10 Footer con enlaces a Home, Blogs, Podcasts, Contacto y redes sociales
BLOGS
- 2.1 Header
- 2.2 Lista de artículos en formato de tarjetas con imagen, categoría, fecha, título y extracto
- 2.3 Paginación o carga adicional (placeholder)
- 2.4 Footer
PODCASTS
- 3.1 Header
- 3.2 Grid de episodios con imagen, icono de sonido, título y breve descripción
- 3.3 Botón de reproducción para cada episodio
- 3.4 Footer
CONTACT
- 4.1 Header
- 4.2 Formulario de contacto simple (nombre, email, mensaje)
- 4.3 Información de contacto y mapa (placeholder)
- 4.4 Footer
Imagen generada con OpenRouter · Nano Banana (Gemini 2.5 Flash Image) · google/gemini-2.5-flash-image · 29/06/2026
PROMPTS RELACIONADOS · BELLEZA / SPA
