NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia **Branding Grimorio** (agencia digital) usando **HTML estático** y **Tailwind CSS vía CDN** (https://cdn.tailwindcss.com) y **JavaScript vanilla** en un solo archivo. La web debe reproducir fielmente la estructura y estilo del sitio original, sin copiar texto ni imágenes literales.
---
**ALCANCE**
- Cabecera (navbar) fija, fondo blanco, logo a la izquierda, enlaces de menú centrados ("Design Agency", "Ba, London"), botón de carrito con contador.
- Hero ocupando el 100vh con fondo degradado #0a0a0a → #1a1a1a, título grande en fuente **Inter** (sans‑serif) color #ffffff, subtítulo gris #d1d5db, botón primario con color #ff6b6b y hover #ff5252.
- Sección de proyectos: grid 3 columnas en desktop, 1 en móvil, tarjetas con sombra ligera, image
4.199 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.199 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 fija con logo, enlaces de menú y botón de carrito
- 1.2 Hero full‑screen con título, subtítulo y botón principal
- 1.3 Cuadrícula de proyectos destacados (3 columnas) con imágenes y breves descripciones
- 1.4 Lista de servicios en tarjetas con icono y texto
- 1.5 Testimonios rotativos en carrusel simple
- 1.6 Sección de clientes con logos en fila horizontal
- 1.7 Footer con logo, enlaces de navegación, datos de contacto y redes sociales
PROYECTOS
- 1.1 Grilla de proyectos (4‑6 tarjetas) con imagen, nombre y categoría
- 1.2 Filtro por categoría (tabs) y carga progresiva
SERVICIOS
- 1.1 Tarjetas de servicio (icono, título, descripción corta)
- 1.2 Botón de contacto rápido bajo cada tarjeta
SOBRE NOSOTROS
- 1.1 Texto institucional con foto del equipo
- 1.2 Historía en línea de tiempo visual
CONTACTO
- 1.1 Formulario de contacto (nombre, email, mensaje)
- 1.2 Mapa incrustado y datos de dirección
FOOTER
- 1.1 Logo secundario
- 1.2 Enlaces rápidos (Inicio, Servicios, Proyectos, Contacto)
- 1.3 Información legal y redes sociales
PROMPTS RELACIONADOS · DIGITAL AGENCY
