NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia **Clínica Sonrisa Clara** (dominio sonrisaclara.com) usando **HTML5**, **Tailwind CSS vía CDN** y **JavaScript vanilla** en un único archivo. El proyecto debe reproducir fielmente la estructura y el estilo del sitio original analizado, sin copiar texto ni imágenes reales. Utiliza los siguientes lineamientos:
---
### Paleta de colores
- #0D3B66 (azul marino profundo) – principal
- #FAF0CA (beige claro) – fondo
- #F4D35E (amarillo mostaza) – acentos
- #EE964B (naranja suave) – botones y enlaces
- #FFFFFF – texto oscuro sobre fondos claros
---
### Tipografía
- **Primary:** 'Inter', sans-serif (carga desde Google Fonts)
- **Secondary:** 'Merriweather', serif para títulos destacados
- **Tamaños base:** text-base = 1rem, títulos h1‑h4 escalados
5.945 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
5.945 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 logo, navegación principal y botón de carrito
- 1.2 Menú móvil con icono hamburguesa y cierre
- 1.3 Hero principal con título, subtítulo y llamado a acción
- 1.4 Sección de servicios en cuadrícula con iconos y descripciones
- 1.5 Bloque de casos de estudio con tarjetas y filtro
- 1.6 Área de blog con últimas entradas y miniaturas
- 1.7 Tienda de productos destacados con botón "Añadir al carrito"
- 1.8 Testimonios en carrusel
- 1.9 Footer con enlaces de navegación, datos de contacto y redes sociales
ABOUT
- 2.1 Cabecera idéntica a la home
- 2.2 Bloque de historia de la clínica con imagen y texto
- 2.3 Equipo de profesionales en tarjetas
- 2.4 Valores y misión en lista de íconos
- 2.5 Footer idéntico a la home
SERVICES
- 3.1 Cabecera idéntica
- 3.2 Lista de servicios con tarjetas ampliables
- 3.3 Preguntas frecuentes en acordeón
- 3.4 CTA para reservar cita
- 3.5 Footer
CASE STUDIES
- 4.1 Cabecera
- 4.2 Galería de casos con filtro por tipo
- 4.3 Detalle de caso con imágenes y descripción
- 4.4 CTA a consulta gratuita
- 4.5 Footer
BLOG
- 5.1 Cabecera
- 5.2 Lista de artículos con imagen, título y extracto
- 5.3 Sidebar con categorías y búsqueda
- 5.4 Footer
CONTACT
- 6.1 Cabecera
- 6.2 Formulario de contacto con campos nombre, email, teléfono y mensaje
- 6.3 Mapa incrustado y datos de localización
- 6.4 Footer
PROMPTS RELACIONADOS · HEALTH AND MEDICINE
