NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia "Lúmina Espiga" (luminaespiga.com) usando un único archivo HTML que incluya Tailwind CSS vía CDN y JavaScript vanilla. El proyecto es un portafolio profesional.
--- REQUISITOS DE DISEÑO ---
- Paleta de colores: #111111 (negro profundo), #FFFFFF (blanco), #FF5722 (naranja vibrante para acentos), #CCCCCC (gris claro para fondos secundarios).
- Tipografía: "Inter", sans‑serif para todo el texto; usar peso 400 para párrafos, 600 para subtítulos y 800 para títulos.
- Header: barra de navegación fija con logo textual "Lúmina" (SVG simple), menú hamburguesa que despliega enlaces horizontales en pantallas >768px y verticales en móvil. Enlace activo resaltado con subrayado.
- Footer: simple barra inferior con © 2026 Lúmina Espiga, enlaces a polític
4.718 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.718 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 de navegación fija con logo y enlaces (Home, About, Projects, Contact)
- 1.2 Badge de ubicación con animación Lottie y texto de ciudad
- 1.3 Hero section: título dividido en dos capas, scroll down indicator, imagen principal con animación de entrada
- 1.4 Sobre mí: párrafo resaltado con acentos de color
- 1.5 Lista de proyectos: grid de tarjetas, cada una con categoría (pill), título, botón “View Project” y máscara de imagen con hover
ABOUT
- 2.1 Barra de navegación (reutilizada)
- 2.2 Hero secundario con foto y texto bio
- 2.3 Línea de tiempo o habilidades (no presente en código original, pero estructurada para la página)
PROJECTS
- 3.1 Barra de navegación
- 3.2 Grid de proyectos (igual que en home, filtrable por categoría)
- 3.3 Detalle de proyecto individual (título, descripción, galería, botones)
CONTACT
- 4.1 Barra de navegación
- 4.2 Formulario de contacto simple (nombre, email, mensaje, botón enviar)
- 4.3 Información de contacto y mapa estático
PROMPTS RELACIONADOS · PORTAFOLIO
