NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia "Spa Neon" (dominio spaneon.com) usando solo un archivo HTML que incluya Tailwind CSS vía CDN y JavaScript vanilla. Replicar el diseño visual y la estructura del sitio analizado:
- Paleta de colores: #1A202C (gris oscuro), #2D3748 (gris medio), #4A5568 (gris suave), #F7FAFC (blanco), #48BB78 (verde acento).
- Tipografía: Inter (Google Fonts) para encabezados y cuerpo.
- Header: barra de navegación fija con logo a la izquierda, menú colapsable en móvil, enlaces "Entrenadores", "Blog", "Planes", "Contacto", botón de carrito que muestra número de ítems, y enlace de login estilo botón secundario.
- Hero: sección a pantalla completa con ilustraciones de hojas a los lados (usar SVG placeholders), título grande centrado, subtítulo y botón CTA
3.525 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.525 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 fija con logo, menú colapsable, botón de carrito y acceso a login
- 1.2 Hero con ilustraciones de hojas laterales, título destacado y llamado a la acción
- 1.3 Sección de categorías resaltadas con tarjetas en grid
- 1.4 Bloque de productos destacados con slider horizontal
- 1.5 Testimonios de clientes en carrusel
- 1.6 Últimas entradas del blog en tarjetas
- 1.7 Footer con enlaces de navegación, redes sociales y datos de contacto
CATEGORÍA
- 2.1 Lista de categorías con filtros y paginación
- 2.2 Cada categoría muestra una cuadrícula de productos con botón de añadir al carrito
PRODUCTO
- 3.1 Detalle del producto con galería de imágenes, descripción, precio y botón de compra
- 3.2 Sección de productos relacionados en carrusel
CARRITO
- 4.1 Vista modal del carrito con resumen de artículos, subtotales y botón de checkout
- 4.2 Formulario de checkout simplificado
BLOG
- 5.1 Lista de artículos del blog con imágenes, excerpt y botón de leer más
- 5.2 Página individual del artículo con contenido completo y comentarios
CONTACTO
- 6.1 Formulario de contacto y mapa embed
- 6.2 Información de la empresa y datos de soporte
PROMPTS RELACIONADOS · BEAUTY / SPA
