NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo de una sola página HTML autocontenida para la marca ficticia LUMARE SKIN STUDIO, una clínica dermoestética premium en España. Claim: 'Tratamientos pensados para tu piel, paso a paso'. Dominio lumareskin.com, email hola@lumareskin.com, año 2025.
STACK Y REQUISITOS TÉCNICOS:
- Un único archivo HTML con Tailwind CSS por CDN (script de cdn.tailwindcss.com) y JavaScript vanilla embebido.
- Sin frameworks externos más allá de Tailwind. Iconos en SVG inline (no librerías).
- Tipografías Google Fonts: 'Fraunces' para titulares (display, weight 400-500, ligeramente itálica permitida) y 'Inter' para texto (400-500).
- Imágenes de Unsplash (URLs directas con parámetros de tamaño) coherentes con dermoestética: retratos en tonos cálidos, manos con sérums, gotas, mascarillas
7.588 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
7.588 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 Header fijo con logo, menú y CTA
- 1.2 Hero con titular display y dos botones
- 1.3 Tres bloques de acción con imagen
- 1.4 Intro de marca con iconos animados
- 1.5 Grid de servicios alternado con fotos
- 1.6 Banner CTA blanco intermedio
- 1.7 Testimonios alternados con datos
- 1.8 Proceso en pasos numerados
- 1.9 Equipo con retratos
- 1.10 FAQ en acordeón
- 1.11 CTA final a pantalla
- 1.12 Footer amplio
SOBRE NOSOTROS
- 2.1 Header
- 2.2 Hero de página con título y breadcrumb sutil
- 2.3 Bloque historia con foto vertical y texto a dos columnas
- 2.4 Banda de valores en cuatro tarjetas con icono
- 2.5 Sección de cifras (años, pacientes, tratamientos, satisfacción)
- 2.6 Galería de instalaciones en masonry
- 2.7 CTA reserva
- 2.8 Footer
SERVICIOS
- 3.1 Header
- 3.2 Hero con título y filtros tipo chip
- 3.3 Grid de servicios con tarjeta, icono, nombre, descripción y enlace
- 3.4 Sección comparativa de tratamientos en tabla
- 3.5 Banner CTA intermedio
- 3.6 FAQ específico de servicios
- 3.7 Footer
NOVEDADES
- 4.1 Header
- 4.2 Hero con título y chip de categorías
- 4.3 Artículo destacado a ancho completo con imagen grande
- 4.4 Grid de tarjetas de artículo con fecha, categoría y resumen
- 4.5 Bloque newsletter con input y botón
- 4.6 Footer
FAQ
- 5.1 Header
- 5.2 Hero de FAQ con título y buscador
- 5.3 Grupos de preguntas por categoría en acordeón
- 5.4 CTA contacto
- 5.5 Footer
RESERVA CONSULTA
- 6.1 Header
- 6.2 Hero corto con título
- 6.3 Formulario a dos columnas con selector de tratamiento, calendario visual y datos
- 6.4 Lateral con resumen de cita y datos de la clínica
- 6.5 Footer
PROMPTS RELACIONADOS · SALUD Y MEDICINA
