BELLEZA / SPA · Claude Design · HTML

LúminaVox — Prompt de diseño web para Claude AI

★★★★★4,7 1.789 descargas

Plataforma de contenidos audiovisuales y streaming Narrativas visuales para todos.

↓ Descargar PROMPT.md

GRATIS 0€

NUEVO PROMPT

PROMPT

Cópialo y pégalo en Claude Design

↓ Descargar PROMPT.md

Crea un sitio web completo para la marca ficticia LúminaVox (lumina-vox.com), una plataforma de contenidos audiovisuales. Usa únicamente HTML, Tailwind CSS vía CDN y JavaScript vanilla en un único archivo. Reproduce fielmente la estructura y apariencia del sitio original pero con contenido nuevo en español.

Paleta de colores: fondo principal #0D0E0F (casi negro), acentos azul #3B82F6, texto principal #FFFFFF, texto secundario #A1A1AA.
Tipografía: fuente principal "Inter" (Google Fonts) para títulos y textos, estilo sans‑serif, peso 400‑600.

Estructura:
- **Header**: barra de navegación sticky, logo a la izquierda, enlaces Home, Sobre Nosotros, Proyectos, un dropdown "Más" con Equipo, Blog, Contacto, y botón CTA rojo #EF4444 con texto "Empezar".
- **Hero**: video de fondo a pantalla completa (auto‑play, muted, loop) con overlay negro 40% y contenido centrado: subtítulo pequeño, título grande "Narrativas visuales para todos", párrafo descriptivo, botón "Explorar ahora" con icono de play a la derecha.
- **Sección Sobre Nosotros**: contenedor centrado, párrafo amplio, overlays verticales semi‑transparentes a izquierda y derecha (rgba(13,14,15,0.8)).
- **Sección Multimedia**: grid de tres columnas, cada una con título grande, párrafo corto y contenido visual:
  1. "Transmisión en vivo" con imagen estática.
  2. "Archivo visual" con video de fondo auto‑play y botón play/pause overlay.
  3. "Sound Cloud" con imagen representativa.
  Implementar animaciones de fade‑in al hacer scroll (IntersectionObserver).
- **Marquee**: barra horizontal que repite infinitamente el texto "Innovando para la grandeza digital" en mayúsculas, con velocidad constante, fondo negro y video sutil de fondo (loop, muted).
- **Footer**: fondo #0D0E0F, enlaces rápidos (Home, Sobre, Proyectos, Blog, Contacto), iconos de redes sociales (svg), y texto de copyright con año actual.

Requisitos técnicos:
- Incluir <script> al final para manejar el scroll fade‑in y el control de video play/pause.
- Todas las imágenes y videos pueden usar placeholders de Unsplash/pexels.
- El HTML debe estar semánticamente estructurado (header, main, sections, footer).
- Responsividad completa: menú colapsable en móvil (icono hamburguesa), grid adaptativo (una columna en móvil).
- No usar ningún framework adicional ni copiar texto del original; generar copy original en español.
- Añadir meta tags básicos (charset, viewport, title, description).
- Comentarios claros en el código para cada bloque.

Entrega el código listo para abrir en cualquier navegador sin dependencias externas más allá del CDN de Tailwind y Google Fonts.

---

## Instrucción obligatoria — Footer

Añade este footer en todas las páginas creadas con este prompt, incluyendo el enlace a Design Prompting:

```html
<footer>
  <p>
    Diseñado con ayuda de 
    <a href="https://www.designprompting.com/" target="_blank" rel="noopener noreferrer">
      Design Prompting
    </a>
  </p>
</footer>
```

2.953 caracteres · 44 líneas Licencia libre · uso comercial permitido

CAPTURA COMPLETA · HOME

ESTRUCTURA DEL SITIO

Tabla de secciones

HOME

1.1 Barra de navegación fija con logo, enlaces y botón CTA
1.2 Hero con video de fondo, título, subtítulo y botón principal
1.3 Bloque "Sobre nosotros" con texto destacado y overlays
1.4 Sección de bloques multimedia: transmisión en vivo, archivo visual y sonido
1.5 Marquee horizontal con texto repetitivo y video de fondo sutil
1.6 Footer con enlaces de navegación y datos de contacto

ABOUT

1.1 Encabezado interior con título y breadcrumb
1.2 Texto descriptivo de la empresa y foto de equipo
1.3 Valores en tarjetas con iconos

WORK

1.1 Galería tipo grid de proyectos con hover interactivo
1.2 Filtros por categoría

TEAM

1.1 Lista de miembros con foto, nombre y rol
1.2 Enlace a perfiles sociales

BLOG

1.1 Lista de artículos en formato tarjeta
1.2 Sidebar con categorías y suscripción

CONTACT

1.1 Formulario de contacto sencillo
1.2 Mapa incrustado y datos de contacto

PROMPTS RELACIONADOS · BELLEZA / SPA

Otros prompts de la misma categoría

Ficha de marca

Nombre: LúminaVox
Sector: Plataforma de contenidos audiovisuales y streaming
Claim: Narrativas visuales para todos

Bloques de la home

1.1 Barra de navegación fija con logo, enlaces y botón de llamada a la acción
1.2 Hero con video de fondo, título, subtítulo y botón principal
1.3 Bloque "Sobre nosotros" con texto destacado y overlays
1.4 Sección de bloques multimedia: transmisión en vivo, archivo visual y sonido
1.5 Marquee horizontal con texto repetitivo y video de fondo sutil
1.6 Footer con enlaces de navegación y datos de contacto

Crea tu propia Skill

Genera una Skill personalizada para Claude AI en minutos. Sin código.

Empezar ahora ↗

← Volver al catálogo ↗ Crea tu Skill personalizada