NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia Instituto Verdial, agencia de diseño y estrategia digital, usando solo HTML estático, Tailwind CSS vía CDN y JavaScript vanilla en un único archivo. Reproduce fielmente la estructura y estilo del sitio analizado: hero a pantalla completa con video de fondo que auto‑reproduce en bucle, sobre él una cuadrícula de cuatro imágenes rotativas que giran suavemente; barra de navegación fija en la parte superior con logo a la izquierda y enlaces de texto (Home, About, Service, Portfolio, Blog, Contact) a la derecha, con sub‑menús desplegables y versión hamburguesa para móviles que muestra un overlay con enlaces y iconos de redes sociales. Usa una paleta oscura (principal #0D0D0D, acento #00FFC8, texto #FFFFFF, gris #7A7A7A). Tipografía: Inter (san
3.818 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.818 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 Hero con video de fondo y rotación de imágenes
- 1.2 Barra de navegación principal con logo y enlaces
- 1.3 Menú hamburguesa móvil con enlaces y redes sociales
- 1.4 Sección de servicios con tarjetas y efectos hover
- 1.5 Portafolio con cuadrícula filtrable
- 1.6 Blog con lista de artículos recientes
- 1.7 Formulario de contacto con mapa integrado
- 1.8 Footer con información de contacto, enlaces útiles y redes sociales
ABOUT
- 2.1 Banner interior con imagen de fondo
- 2.2 Texto descriptivo de la agencia y valores
- 2.3 Equipo con tarjetas de perfil
- 2.4 CTA a proyectos
SERVICE
- 3.1 Lista de servicios con iconos y descripciones
- 3.2 Caso de estudio destacado
- 3.3 CTA a portafolio
PORTFOLIO
- 4.1 Filtro de categorías
- 4.2 Cuadrícula de proyectos con hover
- 4.3 Modal de detalle de proyecto
BLOG
- 5.1 Lista de artículos con miniaturas
- 5.2 Sidebar con categorías y archivos
- 5.3 CTA a suscripción
CONTACT
- 6.1 Formulario de contacto sencillo
- 6.2 Mapa integrado
- 6.3 Información de contacto y redes sociales
PROMPTS RELACIONADOS · EDUCATION
