NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web estática que reproduzca el diseño descrito a continuación usando solo HTML, Tailwind CSS vía CDN y JavaScript vanilla (un único archivo). Marca ficticia: Campus Lumen, dominio campuslumen.com, claim "Muestra tu app con estilo y claridad". Paleta de colores: #0D172A (azul marino fondo), #1E293B (azul grisado), #3B82F6 (azul primario), #F3F4F6 (gris claro), #FFFFFF (blanco). Tipografía: Inter (Google Fonts), peso 400 y 600.
Estructura:
- Header fijo con logo SVG a la izquierda y menú horizontal (Home, Demos, Inner Pages, Utility Pages, Authentication) a la derecha; botón CTA "Purchase template" visible en escritorio y en móvil dentro del menú hamburguesa.
- Hero (section#banner) centrado, contenedor con título h2 grande, párrafo descriptivo y dos botones: "Purchase temp
3.585 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.585 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
- 1.2 Hero con título, párrafo y dos botones CTA
- 1.3 Carrusel de imágenes tipo ticker (loop infinito)
- 1.4 Sección de demos (enlaces internos)
- 1.5 Enlace a página de autenticación y utilidad
- 1.6 Footer con logo, enlaces de navegación y datos de contacto
DEMO
- 2.1 Encabezado reutilizado
- 2.2 Galería de capturas de pantalla de la demo
- 2.3 Descripción de la funcionalidad
- 2.4 Botón CTA para probar la demo
- 2.5 Footer
INNER PAGES
- 3.1 Encabezado reutilizado
- 3.2 Lista de páginas internas con miniaturas
- 3.3 Texto descriptivo genérico
- 3.4 Footer
UTILITY PAGES
- 4.1 Encabezado reutilizado
- 4.2 Tabla de ejemplos de páginas de utilidad (404, términos, privacidad)
- 4.3 Footer
AUTHENTICATION
- 5.1 Encabezado reducido
- 5.2 Formulario de login simple (email, password, botón entrar)
- 5.3 Enlace a registro y recuperación
- 5.4 Footer
PROMPTS RELACIONADOS · EDUCATION
