NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia "Instituto Cedro" (institutocedro.com), sector SaaS de gestión empresarial. Utiliza sólo HTML, Tailwind CSS CDN y JavaScript vanilla en un único archivo. Replicar el diseño visual y la estructura observada en la plantilla analizada, manteniendo los siguientes requisitos:
- Paleta de colores: #1A202C (Rich Navy), #0F172A (Dark Navy), #3B82F6 (Accent Blue), #F3F4F6 (Light Gray), #FFFFFF (White).
- Tipografía: "Inter" para todo el texto, peso 400‑600, tamaños responsivos.
- Header: barra superior con mensaje promocional "Ahorra 25% en planes anuales (Oferta limitada)"; logo a la izquierda; menú de navegación con dropdowns multi‑nivel (Home, Pages, Pricing, Blog, Contact); botón de "Contact us" y número de teléfono visible en escritorio; hambur
3.812 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.812 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 superior promocional con mensaje y descuento
- 1.2 Header con logo, menú mega‑dropdown, botón de contacto y número de teléfono
- 1.3 Hero principal con marquee animado y llamado a la acción
- 1.4 Bloque de indicadores (estadísticas) con iconos y números
- 1.5 Sección de características con tarjetas y efectos hover
- 1.6 Testimonios en carrusel discreto
- 1.7 Comparativa de planes de precios con tarjetas resaltadas
- 1.8 Llamada a la acción secundaria con botón destacado
- 1.9 Footer con enlaces de navegación, redes sociales y datos de contacto
ABOUT
- 2.1 Imagen heroica con texto descriptivo
- 2.2 Misión, visión y valores en bloques alineados
- 2.3 Equipo con foto y breve bio
- 2.4 CTA para solicitar demo
FEATURES
- 3.1 Grid de funcionalidades con iconos y descripciones breves
- 3.2 Video explicativo incrustado
- 3.3 Lista de beneficios en columnas
PRICING
- 4.1 Tabla comparativa de tres planes con precios ficticios y características
- 4.2 Botones de selección de plan
CONTACT
- 5.1 Formulario de contacto con campos nombre, email, mensaje
- 5.2 Información de contacto y mapa estático
BLOG
- 6.1 Lista de artículos con miniatura, título y extracto
- 6.2 Sidebar con categorías y búsqueda
- 6.3 Paginación inferior
PROMPTS RELACIONADOS · EDUCACIÓN