NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia Lumenia Verde (lumeniaverde.com), sector energía solar, con el siguiente alcance y stack: HTML estático, Tailwind CSS vía CDN, JavaScript vanilla en un único archivo. Usa la paleta de colores: #0A3D62 (azul profundo), #1ABC9C (verde agua), #F1C40F (amarillo solar), #FFFFFF (blanco), #F7F9F9 (gris muy claro). Tipografía: encabezados con 'Inter' (font-weight 700), cuerpo con 'Roboto' (font-weight 400). Reproduce la estructura UI del sitio original:
**Header**: barra fija superior, logo a la izquierda (texto Lumenia Verde), menú principal horizontal (Inicio, Sobre nosotros, Proyectos, Precios, Contacto) + ícono de carrito a la derecha. Menú responsive con hamburger que muestra un panel lateral con los mismos enlaces.
**Hero**: sección ful
4.383 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.383 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 Barra de navegación fija con logo, menú principal y carrito
- 1.2 Hero con fondo claro, título destacado y llamado a la acción
- 1.3 Sección de ventajas con iconos y breves descripciones
- 1.4 Galería de proyectos en formato grid responsive
- 1.5 Tabla comparativa de planes de energía solar
- 1.6 Testimonios rotativos con foto y cita
- 1.7 Formulario de contacto rápido y mapa embedido
- 1.8 Footer con enlaces de navegación, datos de la empresa y redes sociales
ABOUT
- 2.1 Header interno idéntico al de Home
- 2.2 Bloque de historia de la empresa con imagen a la izquierda y texto a la derecha
- 2.3 Valores y misión en tarjetas con iconos
- 2.4 Equipo con fotos circulares y breves biografías
- 2.5 CTA para solicitar una auditoría gratuita
- 2.6 Footer
PROJECTS
- 3.1 Header interno
- 3.2 Grid de proyectos con filtro por tipo
- 3.3 Tarjetas de proyecto con imagen, nombre, breve descripción y botón "Ver detalle"
- 3.4 Footer
PRICING
- 4.1 Header interno
- 4.2 Tabla de precios con tres columnas (Básico, Estándar, Premium)
- 4.3 Cada columna muestra características, iconos y botón de contacto
- 4.4 FAQ accordión
- 4.5 Footer
CONTACT
- 5.1 Header interno
- 5.2 Formulario de contacto con campos nombre, email, asunto y mensaje
- 5.3 Mapa de ubicación embedido de Google Maps
- 5.4 Información de contacto (dirección, teléfono, email)
- 5.5 Footer
PROMPTS RELACIONADOS · CORPORATIVO
