NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia **Instituto Vendaval** (agencia digital) usando **HTML** y **Tailwind CSS CDN** en un solo archivo, con interactividad mínima en **JavaScript vanilla**. Reproduce fielmente la estructura y patrones visuales del sitio original:
- **Paleta de colores**: #0A0A0A (fondo negro), #FFFFFF (texto blanco), #F5A623 (amarillo vibrante para acentos), #333333 (gris oscuro para fondos secundarios).
- **Tipografía**: Font family "Inter", sans‑serif; títulos con peso 800, cuerpo con peso 400; tamaños responsivos (h1 4xl‑6xl, h2 3xl‑4xl, texto base lg).
- **Header**: barra fija, fondo negro semi‑transparente, logo a la izquierda (texto "Lúmina" con estilo bold y color amarillo), menú a la derecha con enlaces Home, Projects, Services, About, Blog, Shop; h
4.027 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.027 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 Encabezado con logo y menú de navegación responsive
- 1.2 Hero con título grande y subtítulo centrado
- 1.3 Galería de proyectos en cuadrícula con hover y botón "Ver todos"
- 1.4 Texto introductorio sobre la filosofía del creador
- 1.5 Sección "Qué hago mejor" con cuatro tarjetas de servicio, cada una con subtítulos y lista de categorías
- 1.6 Pie de página con enlaces de navegación y datos de contacto
PROJECTS
- 2.1 Lista en cuadrícula de proyectos con imágenes y títulos
- 2.2 Barra lateral de filtro por categoría (opcional)
- 2.3 Botón volver al inicio
ABOUT
- 3.1 Foto del equipo y biografía breve
- 3.2 Valores y misión
- 3.3 Botón de contacto
SERVICES
- 4.1 Tarjetas descriptivas de servicios con iconos
- 4.2 CTA para solicitar presupuesto
BLOG
- 5.1 Lista de artículos con miniaturas y extractos
- 5.2 Paginación
SHOP
- 6.1 Grid de productos con imágenes, nombre y botón "Añadir al carrito"
- 6.2 Barra de carrito flotante
CONTACT
- 7.1 Formulario de contacto simple
- 7.2 Mapa incrustado
- 7.3 Información de contacto
PROMPTS RELACIONADOS · EDUCATION
