NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web estático en un único archivo HTML que reproduzca fielmente el diseño analizado, usando Tailwind CSS vía CDN y JavaScript vanilla para interacciones simples (menú desplegable, animación de aparición). Marca ficticia: Saas Boreal (dominio saasboreal.com). Tema: landing page de plantilla SaaS, con los siguientes elementos:
- Paleta de colores: #0A0F24 (fondo oscuro), #1E293B (tarjetas y secciones), #3B82F6 (azul primario), #F9FAFB (texto claro), #6B7280 (texto secundario).
- Tipografía: Inter (sans-serif) para todo el texto, tamaños y pesos según jerarquía (h1 48px, h2 36px, h3 24px, cuerpo 16px).
- Header fijo con logo SVG placeholder, menú principal (Home, About, Insights, Case Studies), dropdown "All Pages" con tres columnas de enlaces, y botón CTA "Get Started for Free"
3.750 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.750 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, menú desplegable y botón CTA
- 1.2 Hero con título destacado y subtítulo
- 1.3 Detalle de la plantilla: estadísticas, imágenes y descripción
- 1.4 Bloque Figma file incluido con CTA de email
- 1.5 Galería de homepages demo (3 tarjetas)
- 1.6 Galería de páginas internas (17 tarjetas)
- 1.7 Footer con links y datos de contacto
ABOUT
- 2.1 Header interno (reutiliza barra principal)
- 2.2 Sección de presentación con imagen y texto descriptivo
- 2.3 Equipo o valores (cards)
- 2.4 CTA a contacto
- 2.5 Footer estándar
CAREERS
- 3.1 Header interno
- 3.2 Listado de ofertas con tarjetas
- 3.3 Formulario breve de aplicación
- 3.4 CTA a envío de CV
- 3.5 Footer
INSIGHTS
- 4.1 Header interno
- 4.2 Grid de artículos con imagen, título y extracto
- 4.3 Paginación simple
- 4.4 Footer
BLOG DETAIL
- 5.1 Header interno
- 5.2 Artículo completo con encabezado, imagen hero y cuerpo de texto
- 5.3 Sección de artículos relacionados
- 5.4 Footer
CASE STUDY
- 6.1 Header interno
- 6.2 Detalle del caso con timeline y resultados
- 6.3 Testimonios
- 6.4 CTA a contacto
- 6.5 Footer
CONTACT
- 7.1 Header interno
- 7.2 Formulario de contacto (nombre, email, mensaje)
- 7.3 Información de contacto y mapa
- 7.4 Footer
Imagen generada con OpenRouter · Nano Banana (Gemini 2.5 Flash Image) · google/gemini-2.5-flash-image · 11/07/2026
PROMPTS RELACIONADOS · SAAS / STARTUP
