NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia **Tech Boreal** (plataforma SaaS de gestión de proyectos) usando **HTML estático**, **Tailwind CSS CDN** y **JavaScript vanilla** en un solo archivo. La web debe replicar el diseño estructural y visual del sitio de referencia, sin copiar texto ni imágenes originales.
**Alcance**: Home, About, Features, Blog y Contact, cada una con los bloques descritos en la tabla. Incluir un header fijo con logo, menú principal, dropdown multilínea y botón "Get started", y un carrito iconográfico simple (no funcional). Footer con enlaces, información legal y redes sociales.
**Paleta de colores**:
- Primario: #1E3A8A (azul oscuro)
- Secundario: #3B82F6 (azul brillante)
- Fondo: #F9FAFB (gris muy claro)
- Texto principal: #111827 (negro profundo)
- Texto
4.440 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.440 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 fijo con logo, menú principal, dropdown de páginas y botón "Get started"
- 2.1 Hero principal con título, subtítulo y botón CTA
- 3.1 Bloque de características en grid de 3 columnas con íconos y texto
- 4.1 Sección de integraciones mostrando logos de partners
- 5.1 Testimonios en carrusel horizontal
- 6.1 Llamado a la acción secundario con formulario de captura de email
- 7.1 Blog destacado con tarjetas de artículos recientes
- 8.1 Footer con enlaces de navegación, información legal y redes sociales
ABOUT
- 1.1 Header (reutilizado)
- 2.1 Sección de historia y valores con imagen ilustrativa
- 3.1 Equipo resaltado en tarjetas con foto y perfil
- 4.1 CTA para unirse al equipo o solicitar demo
- 5.1 Footer (reutilizado)
FEATURES
- 1.1 Header
- 2.1 Hero de funcionalidades con imagen de producto
- 3.1 Lista detallada de características en tabs interactivos
- 4.1 Video demo incrustado
- 5.1 Comparativa de planes (sin precios explícitos)
- 6.1 Footer
BLOG
- 1.1 Header
- 2.1 Grid de artículos con imágenes, títulos y extractos
- 3.1 Barra lateral con categorías y búsqueda
- 4.1 Footer
CONTACT
- 1.1 Header
- 2.1 Formulario de contacto completo (nombre, email, mensaje)
- 3.1 Mapa embebido de ubicación ficticia
- 4.1 Información de contacto y redes sociales
- 5.1 Footer
PROMPTS RELACIONADOS · TECNOLOGÍA