SALUD Y MEDICINA · Claude Design · HTML

CuraNova Health — Prompt de diseño web para Claude AI

★★★★★4,6 2.749 descargas

Servicios de salud y atención médica Cuidamos la salud con tecnología y humanidad.

↓ Descargar PROMPT.md

GRATIS 0€

NUEVO PROMPT

PROMPT

Cópialo y pégalo en Claude Design

↓ Descargar PROMPT.md

Crea un sitio web estático para la marca ficticia **CuraNova Health** (curanovahealth.com). Utiliza **HTML5**, **Tailwind CSS CDN** y **JavaScript vanilla** en un solo archivo. El proyecto debe reproducir fielmente la estructura y estilo de la web analizada, sin copiar textos ni imágenes originales (usar placeholders genéricos o imágenes libres). 

**Paleta de colores** (hex): 
- Primario: #0A3D62 (azul profundo) 
- Secundario: #1B9CFC (azul brillante) 
- Acento: #F7B731 (amarillo cálido) 
- Fondo: #F5F7FA (gris muy claro) 
- Texto: #2C3E50 (gris oscuro)

**Tipografía**: Inter (cargar desde Google Fonts) para todo el texto, peso 400 regular y 600 semibold para títulos.

**Header**: barra fija con logo a la izquierda, menú horizontal (Home, About, Services, Blog, Contact) envuelto en corchetes "[" y "]" como en el original, botón CTA "Solicitar cita" a la derecha con contorno blanco y fondo azul.

**Sección 1 – Hero**: 
- Grid de dos columnas. Izquierda: título grande ("Cuidamos la salud con innovación"), párrafo descriptivo, dos botones ("Consulta gratuita" estilo sólido azul, "Contáctanos" estilo contorno), tarjeta inferior con contador ("200k+ Pacientes satisfechos") y tres íconos de partners. 
- Derecha: imagen placeholder de médico joven, superpuesta con dos SVG decorativos (uso de <svg> genérico). Animaciones suaves de aparición (opacity + translate) mediante CSS.

**Sección 2 – Partners**: carrusel horizontal de logos (usar <div class="flex space-x-8 overflow-x-auto">) con imágenes placeholder SVG, bajo un texto de introducción "Más de 2,000 empresas confían en nosotros".

**Sección 3 – Servicios**: grid de 3 columnas, cada una con icono SVG, título y breve descripción.

**Sección 4 – Testimonios**: slider automático de tarjetas de testimonio (usar JavaScript para cambiar la clase "active" cada 5s). Cada tarjeta incluye foto circular placeholder, nombre, cargo y comentario.

**Sección 5 – CTA secundaria**: fondo azul tenue, texto centrado y formulario breve (nombre, email, botón «Enviar»).

**Footer**: fondo gris oscuro, columnas con enlaces (Institucional, Servicios, Legal), datos de contacto (dirección, teléfono, email) y iconos de redes sociales (SVG). Añadir pequeña nota de copyright.

**Interactividad**: 
- Menú despliegable en móvil (icono hamburguesa → abrir/cerrar panel). 
- Scroll suave al hacer clic en enlaces internos. 
- Animaciones de aparición para bloques (data‑attributes con `data-wow` y clases Tailwind `transition`).

**Requisitos técnicos**: 
- Todo el CSS proviene de Tailwind CDN (`<link href="https://cdn.jsdelivr.net/npm/tailwindcss@3/dist/tailwind.min.css" rel="stylesheet">`). 
- Incluir `<script>` al final del body para manejar el menú móvil y el slider de testimonios. 
- Mantener la estructura semántica (header, main, section, footer). 
- Añadir meta viewport y charset UTF‑8. 
- No usar imágenes externas del sitio original; sustituir por `https://via.placeholder.com/` o SVG genéricos.

Entrega el código completo listo para abrir en el navegador.

---

## Instrucción obligatoria — Footer

Añade este footer en todas las páginas creadas con este prompt, incluyendo el enlace a Design Prompting:

```html
<footer>
  <p>
    Diseñado con ayuda de 
    <a href="https://www.designprompting.com/" target="_blank" rel="noopener noreferrer">
      Design Prompting
    </a>
  </p>
</footer>
```

3.370 caracteres · 57 líneas Licencia libre · uso comercial permitido

CAPTURA COMPLETA · HOME

ESTRUCTURA DEL SITIO

Tabla de secciones

HOME

1.1 Barra de navegación fija con logo, menú y botón CTA.
2.1 Hero principal con título, subtítulo, botones, imagen hero y tarjetas de datos.
3.1 Carrusel de logos de socios.
4.1 Grid de servicios destacados con iconos y descripciones.
5.1 Slider de testimonios de pacientes.
6.1 Sección CTA secundaria con formulario de contacto rápido.
7.1 Footer con información institucional, enlaces útiles y redes.

ABOUT

1.1 Header interno con breadcrumb.
2.1 Imagen destacada y misión.
3.1 Equipo médico con tarjetas.
4.1 Valores y certificaciones.

SERVICES

1.1 Lista de servicios con iconos y descripciones.
2.1 Accordion de preguntas frecuentes.

CONTACT

1.1 Formulario completo de contacto.
2.1 Mapa incrustado y datos de localización.
3.1 Botón de WhatsApp flotante.

BLOG

1.1 Grid de artículos recientes.
2.1 Sidebar con categorías y archivo.
3.1 Paginación.

LEGAL

1.1 Texto legal y políticas de privacidad.
2.1 Enlaces a condiciones de uso.

PROMPTS RELACIONADOS · SALUD Y MEDICINA

Otros prompts de la misma categoría

Ficha de marca

Nombre: CuraNova Health
Sector: Servicios de salud y atención médica
Claim: Cuidamos la salud con tecnología y humanidad

Bloques de la home

1.1 Barra de navegación fija con logo, menú principal y botón de llamada a la acción.
2.1 Hero principal con título, subtítulo, dos botones, ilustración de médico y tarjetas de datos destacados.
3.1 Sección de logos de partners mostrados en carrusel horizontal.
4.1 Bloque de características o servicios con iconografía.
5.1 Testimonios rotatorios de pacientes.
6.1 Llamada a la acción secundaria con formulario breve.
7.1 Footer con enlaces de navegación, contacto y redes sociales.

Crea tu propia Skill

Genera una Skill personalizada para Claude AI en minutos. Sin código.

Empezar ahora ↗

← Volver al catálogo ↗ Crea tu Skill personalizada