NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia LumenStudio, una agencia creativa de diseño y desarrollo digital. Utiliza solo HTML, Tailwind CSS (CDN) y JavaScript vanilla en un único archivo. La paleta de colores debe incluir:
- #0D0D0D (fondo negro profundo)
- #FFFFFF (texto blanco)
- #1A73E8 (azul acento para enlaces y botones)
- #F5F5F5 (gris muy claro para áreas de contenido)
- #FFB800 (amarillo cálido para destacados)
Tipografía: Inter (Google Fonts) para títulos y texto, peso 400‑700.
Estructura del sitio:
1. HEADER: barra fija superior con logo a la izquierda, menú de navegación centrado (Home, About, Services, Projects, Blog, Contact) y botón primario "Contact" a la derecha. En dispositivos móviles colapsa en icono hamburguesa que abre un overlay con los enlaces.
2. HERO SECT
4.164 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.164 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 Header con logo, menú y botón Contact
- 2.1 Hero con saludo, nombre, ubicación y foto
- 3.1 Contadores de métricas (clientes, proyectos, años)
- 4.1 Galería de proyectos destacados en grid
- 5.1 Footer con enlaces y datos de contacto
ABOUT
- 1.1 Header reutilizado
- 2.1 Texto descriptivo sobre la agencia y foto
- 3.1 Equipo y valores (bloque sencillo)
- 4.1 Footer reutilizado
SERVICES
- 1.1 Header reutilizado
- 2.1 Lista de servicios con iconos y descripción breve
- 3.1 CTA para solicitar presupuesto
- 4.1 Footer reutilizado
PROJECTS
- 1.1 Header reutilizado
- 2.1 Grid de proyectos con filtro por categoría
- 3.1 Modal o página detalle de proyecto (no incluido en home)
- 4.1 Footer reutilizado
BLOG
- 1.1 Header reutilizado
- 2.1 Lista de artículos con previsualización
- 3.1 Sidebar con categorías y últimos posts
- 4.1 Footer reutilizado
CONTACT
- 1.1 Header reutilizado
- 2.1 Formulario de contacto simple (nombre, email, mensaje)
- 3.1 Información de contacto y mapa embebido
- 4.1 Footer reutilizado
PROMPTS RELACIONADOS · AGENCIA DIGITAL
