NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea el diseño web completo de **Luna Negra**, una cafetería de especialidad que narra sus lotes de café como una publicación editorial. Utiliza solo HTML estático y Tailwind CSS vía CDN, con JavaScript vanilla en un único archivo para interactividad mínima (menú móvil, preloader y ticker).
**Paleta de colores** (usar en Tailwind extendido):
- #0A0A0A (negro profundo)
- #1A1A1A (gris casi negro)
- #D4C19F (beige café)
- #C04E2A (café tostado)
- #FFFFFF (blanco)
**Tipografía**:
- Titulares: "Playfair Display", serif, peso 700, tracking -0.02em
- Cuerpo y UI: "Inter", sans-serif, peso 400‑500
**Estructura**:
1. **Header**: barra de navegación fija, logo a la izquierda (texto "Luna Negra" y subtítulo "·Est 2026"), enlaces horizontales (Home, Story, Menu, Coffees, Space, Voices, Vi
5.119 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
5.119 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 barra de navegación y menú móvil
- 1.2 Preloader animado con barra de progreso
- 1.3 Hero con fondo multimedia, numeración y ticker
- 1.4 Bloque Story: texto narrativo + imagen ambiente
- 1.5 Bloque Menu: cuadrícula de productos con precios simulados
- 1.6 Bloque Coffees: lista de cafés de origen con detalle de cultivo
- 1.7 Bloque Gallery: mosaico de fotos del espacio
- 1.8 Bloque Voices: carrusel de testimonios
- 1.9 Bloque Contact: formulario simple y datos de visita
- 1.10 Footer con información de contacto y redes
STORY
- 2.1 Título grande y subtítulo descriptivo
- 2.2 Texto largo con historia de la marca
- 2.3 Imagen de detalle del local
MENU
- 3.1 Título de sección y breve descripción
- 3.2 Grid de tarjetas de producto (imagen, nombre, breve descripción, botón "Ver más")
COFFEES
- 4.1 Título de sección y filtro por origen
- 4.2 Listado de tarjetas con foto, nombre, altitud, método y notas de cata
GALLERY
- 5.1 Título y galería de imágenes estilo masonry
VOICES
- 6.1 Título y carrusel de citas de clientes con foto y nombre
CONTACT
- 7.1 Título, dirección, horario y mapa embebido
- 7.2 Formulario de contacto (nombre, email, mensaje, botón enviar)
FOOTER
- 8.1 Logo pequeño, enlaces de navegación, redes sociales y aviso legal
PROMPTS RELACIONADOS · RESTAURANTE Y COMIDA
