NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia "Sistemas Orion" (estudio creativo de branding y diseño digital) usando HTML estático, Tailwind CSS vía CDN y JavaScript vanilla en un solo archivo. El sitio debe reproducir fielmente la arquitectura visual de la plantilla analizada, sin copiar textos ni imágenes originales.
**Alcance**: Home, About, Services, Case Studies, Contact y Footer. Cada página debe usar la misma paleta de colores y tipografías.
**Paleta de colores**: #0A0A0A (negro profundo), #FFFFFF (blanco), #E0E0E0 (gris claro), #0066FF (azul accent), #F5F5F5 (fondo suave).
**Tipografía**: Font family "Inter", sans-serif, peso 400 y 600 para encabezados.
**Header**: barra fija con logo (texto Lúmina), menú horizontal (Home, About, Services, Case Studies, Contact) colapsable en
4.291 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.291 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 con logo y menú responsive
- 1.2 Hero circular con cuadrícula de 10 imágenes animadas
- 1.3 Bloque de contadores (proyectos, clientes, años)
- 1.4 Servicios en tarjetas con icono y breve descripción
- 1.5 Casos de estudio en grid de 3 columnas
- 1.6 CTA de contacto con botón destacado
- 1.7 Footer con links institucionales y redes sociales
ABOUT
- 2.1 Cabecera interna con título y breadcrumb
- 2.2 Texto descriptivo de la empresa y valores
- 2.3 Equipo en cards circulares
- 2.4 CTA a caso de estudio
SERVICES
- 3.1 Lista de servicios en columnas
- 3.2 Detalle de cada servicio con icono y texto
- 3.3 Testimonios rotativos
- 3.4 CTA a contacto
CASE STUDIES
- 4.1 Grid de proyectos con filtro por categoría
- 4.2 Cada proyecto muestra imagen, título y breve descripción
- 4.3 Botón para leer caso completo
CONTACT
- 5.1 Formulario de contacto simple (nombre, email, mensaje)
- 5.2 Mapa estático de ubicación ficticia
- 5.3 Información de contacto directa
FOOTER
- 6.1 Logo y breve descripción
- 6.2 Enlaces de navegación secundaria
- 6.3 Íconos de redes sociales (Instagram, X, LinkedIn, Facebook)
- 6.4 Copyright y política de privacidad
PROMPTS RELACIONADOS · TECNOLOGÍA