NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia Instituto Zenit con el objetivo de presentar un portafolio profesional de diseño UI/UX. Utiliza únicamente HTML, Tailwind CSS (CDN) y JavaScript vanilla en un único archivo. La paleta de colores debe basarse en tonos azul oscuro y gris claro: #0A304F, #1E6F9F, #E5F2FF, #F3F6FA, #FFFFFF. Tipografía: fuente principal "Inter" (sans-serif) para encabezados y cuerpo, con peso 400‑700.
Estructura y componentes:
- **Header**: barra fija con fondo semi‑transparente, logo a la izquierda, menú de navegación (Home, About, Projects, Blogs, Services, Contact) con efecto hover que cambia el color del texto a #1E6F9F y subraya. Botón destacado a la derecha "Contratar" con fondo #1E6F9F y texto blanco.
- **Hero**: división de dos columnas. Izquierda: fot
4.243 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.243 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 Cabecera fija con logo, menú y botón 'Contratar'
- 1.2 Hero: foto, saludo, nombre, títulos profesionales en carrusel, breve texto introductorio
- 1.3 Bloque de contacto rápido: teléfono, email, iconos sociales con hover
- 1.4 Sección de servicios: cuadrícula de tarjetas, icono, título, descripción breve, botón 'Ver más'
- 1.5 Footer: logo pequeño, enlaces de navegación secundaria y derechos de autor
ABOUT US
- 2.1 Cabecera reutilizada
- 2.2 Imagen ampliada del equipo y texto descriptivo extendido
- 2.3 Valores y metodología en bloques tipo timeline
PROJECTS
- 3.1 Cabecera reutilizada
- 3.2 Galería de proyectos con filtro por categoría
- 3.3 Cada proyecto muestra imagen destacada, título, breve descripción y enlace a caso de estudio
BLOGS
- 4.1 Cabecera reutilizada
- 4.2 Lista de artículos en tarjetas con imagen, título, extracto y botón 'Leer más'
- 4.3 Paginación simple al final de la lista
SERVICES
- 5.1 Cabecera reutilizada
- 5.2 Detalle de cada servicio en secciones separadas con icono, texto amplio y botón de llamado a acción
CONTACT US
- 6.1 Cabecera reutilizada
- 6.2 Formulario de contacto: nombre, email, asunto, mensaje y botón enviar
- 6.3 Información de contacto completa y mapa incrustado
PROMPTS RELACIONADOS · EDUCATION
