NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web estático con HTML, Tailwind CDN y JavaScript puro (un solo archivo) que reproduzca el diseño de "LetrasVivas", una comunidad online para escritores y poetas. Usa la paleta de colores: #1A202C (fondo principal), #2D3748 (nav y footer), #F7FAFC (texto claro), #4299E1 (botones y acentos). Tipografía: "Inter" para títulos y "Libre Baskerville" para textos.
Estructura:
- <header class="fixed top-0 w-full bg-gray-800 text-white flex items-center justify-between p-4"> con logo placeholder, menú hamburguesa (mobile) y enlaces: Demos, Sobre Nosotros, Autores, Galería, Eventos, Concursos, Contacto y botón destacado "Únete ahora" con fondo azul.
- <section id="hero" class="mt-16 bg-gray-100 text-center py-20"> con h1 "Comunidad de Escritores y Poetas", p descriptivo y dos botones:
3.482 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.482 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 Navbar fijo con logo, menú desplegable y botón "Únete ahora"
- 2.1 Hero con título, descripción y botones de navegación
- 3.1 Sección informativa de demos preconstruidos con título, párrafo y tarjetas de capturas
- 4.1 Footer con enlaces a secciones, redes y datos de contacto
ABOUT US
- 1.1 Header convencional con logo y navegación
- 2.1 Texto descriptivo de la comunidad y misión
- 3.1 Equipo y valores en tarjetas
- 4.1 Footer compartido
AUTHORS
- 1.1 Header
- 2.1 Lista de autores con foto y breve bio
- 3.1 Botón para ver perfil completo
- 4.1 Footer
GALLERY
- 1.1 Header
- 2.1 Galería tipo grid de imágenes de obras
- 3.1 Lightbox al hacer clic
- 4.1 Footer
EVENTS
- 1.1 Header
- 2.1 Calendario de próximos eventos
- 3.1 Tarjetas de evento con fecha, lugar y registro
- 4.1 Footer
COMPETITIONS
- 1.1 Header
- 2.1 Lista de concursos activos
- 3.1 Botón para participar
- 4.1 Footer
CONTACT US
- 1.1 Header
- 2.1 Formulario de contacto (nombre, email, mensaje)
- 3.1 Mapa embebido y datos de contacto
- 4.1 Footer
PROMPTS RELACIONADOS · BELLEZA / SPA
