ENTRETENIMIENTO · Tailwind · HTML5 · Vanilla JS

Lúmina Arte – Museo de arte contemporáneo y experiencias inmersivas

★★★★★4,9 4.362 descargas

Tema web estático para Lúmina Arte, museo contemporáneo, con hero fullscreen, secciones de exposiciones, galería de obras y reserva de visita. Implementado con Tailwind CDN y JavaScript puro, optimizado para SEO y accesibilidad.

↓ Descargar PROMPT.md

GRATIS 0€

NUEVO PROMPT

PROMPT

Cópialo y pégalo en Claude Design

↓ Descargar PROMPT.md

Crea un sitio web estático para la marca ficticia "Lúmina Arte" (luminaarte.com), museo de arte contemporáneo. Utiliza HTML5 y Tailwind CSS vía CDN, con JavaScript vanilla en un único archivo. 

**Paleta de colores**: #0D1B2A (azul noche), #1B263B (gris azulado), #415A77 (azul acero), #778DA9 (gris claro), #E0E1DD (beige suave). 
**Tipografía**: "Inter" para títulos y cuerpo, peso 400‑700, cargada de Google Fonts.

**Header**: barra superior fija con logo textual "Lúmina Arte", enlaces horizontales Home, Exposiciones, Obras, Visita, Contacto. En móvil, colapsar a ícono de menú hamburguesa que abre overlay con los enlaces. A la derecha del menú, mostrar horario (Mi‑Lu 11‑19h) y dirección (456 Avenida Innovación, Ciudad). 

**Sección 1 – Hero**: contenedor a pantalla completa con imagen de fondo de una obra clásica en alta resolución, overlay oscuro (rgba 0,0,0,0.4). Texto centrado: título grande "DONDE EL ARTE MODERNO COBRA VIDA" en Inter‑Bold 4xl, subtítulo en mayúsculas "LÚMINA ARTE" y botón primario "Descubre nuestras exhibiciones" (bg #415A77, hover #778DA9). 

**Sección 2 – Sobre nosotros**: layout dividido en dos columnas; columna izquierda con títulos apilados verticalmente (4 líneas, cada una con clase .text-5xl, color #E0E1DD) formando un bloque escalonado; columna derecha con imagen ilustrativa y texto breve "Somos un punto de encuentro cultural que impulsa la expresión contemporánea" en gris claro. 

**Sección 3 – Exposiciones**: tres tarjetas horizontales apiladas verticalmente, cada una con imagen de gran tamaño, etiqueta superior "PRÓXIMA" o "DESTACADA" en fondo #1B263B, texto título de exposición en Inter‑Bold 2xl, autor en Inter‑Regular 1xl. Botón secundario "Más info" (border #415A77, texto #415A77). 

**Sección 4 – Obras**: cuadrícula responsive (3 columnas en desktop, 2 en tablet, 1 en móvil). Cada tarjeta muestra imagen, debajo título, creador y año. Hover: sutil zoom (scale 1.05) y sombra. 

**Sección 5 – Planifica tu día**: bloque con título "PLANIFICA TU VISITA" en Inter‑Bold 3xl, párrafo descriptivo y imagen a la derecha. Botón CTA "Reserva ahora" (bg #0D1B2A, hover #1B263B). 

**Footer**: fondo #0D1B2A, columnas: contacto (email, teléfono), ubicación, enlaces rápidos. Texto en #E0E1DD, enlaces con hover #415A77. 

**Interactividad**: 
- Menú hamburguesa abre/cierra overlay con transición suave. 
- Scroll suave entre anclas. 
- Animaciones de aparición (fade‑in) para bloques al hacer scroll (usando IntersectionObserver). 
- Botón de reserva muestra modal sencillo con formulario (nombre, email, fecha). 

**Requisitos técnicos**: 
- Todo el CSS a través de Tailwind CDN (`https://cdn.tailwindcss.com`). 
- Incluir `<script>` al final para comportamiento del menú, scroll y modal. 
- Optimizar imágenes con `loading="lazy"`. 
- Mantener el HTML semántico (header, main, section, footer). 
- Asegurar accesibilidad (atributos `aria-label`, contraste de colores).

---

## 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>
```

3.269 caracteres · 48 líneas Licencia libre · uso comercial permitido

CAPTURA COMPLETA · HOME

PROMPTS RELACIONADOS · ENTRETENIMIENTO

Otros prompts de la misma categoría

Ficha de marca

Nombre: Lúmina Arte
Sector: Museo de arte contemporáneo y experiencias inmersivas
Claim: Espacios donde el arte respira y transforma

Bloques de la home

1.1 Hero con fondo a pantalla completa, menú hamburguesa, horario y dirección.
2.1 Bloque "Sobre nosotros" con títulos verticales y foto acompañada de texto descriptivo.
3.1 Sección de exposiciones destacadas, tarjetas con imagen, estado (próxima/actual) y autor.
4.1 Galería de obras, cuadrícula de tarjetas con imagen, título, autor y año.
5.1 Planifica tu visita, llamada a la acción con imagen ilustrativa.
6.1 Footer con datos de contacto y enlaces de navegación.

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

Lúmina Arte – Museo de arte contemporáneo y experiencias inmersivas

Cópialo y pégalo en Claude Design

Otros prompts de la misma categoría

Ludicra Studios

Ludoteca Nova

LumenArtes

Lúmina Arte