NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia "Compras Polar" (compraspolar.com), sector cosmética natural, usando únicamente HTML estático y Tailwind CSS vía CDN, con JavaScript vanilla en un solo archivo. Reproduce fielmente la estructura y estilo descritos:
- Paleta de colores: #1A1A1A (fondo principal), #FFFFFF (texto), #E0AFA0 (acentos rosados), #F5F5F5 (gris claro de secciones), #000000 (texto oscuro).
- Tipografía: "Montserrat" para títulos, "Open Sans" para cuerpo, ambas importadas de Google Fonts.
- Header sticky con barra superior que muestra "Envío estándar gratuito en compras superiores a 50€"; incluye logo (texto Compras Polar), menú horizontal (Home, Sobre Nosotros, Tienda, Blog, Contacto) con dropdown bajo "Páginas" que lista Home, Home 2, Tienda, Blog, Sobre, Contacto,
4.030 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.030 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 superior con mensaje informativo
- 1.2 Header con logo, navegación principal, buscador, icono de carrito
- 1.3 Hero principal con título, subtítulo y botón CTA
- 1.4 Bloque de categorías destacadas en grid
- 1.5 Sección de productos destacados con carrusel
- 1.6 Testimonios de clientes en tarjetas
- 1.7 Blog reciente con tarjetas
- 1.8 Newsletter signup
- 1.9 Footer con links, redes y suscripción
SHOP
- 1.1 Header reutilizado
- 1.2 Filtros laterales y barra de ordenación
- 1.3 Grid de productos con botón "Añadir al carrito"
- 1.4 Paginación
- 1.5 Footer reutilizado
PRODUCT DETAIL
- 1.1 Header reutilizado
- 1.2 Galería de imágenes del producto
- 1.3 Información del producto (nombre, descripción, precio, selector de variante)
- 1.4 Botón añadir al carrito y sección de reseñas
- 1.5 Productos relacionados en carrusel
- 1.6 Footer reutilizado
ABOUT
- 1.1 Header reutilizado
- 1.2 Hero con mensaje institucional
- 1.3 Historia de la marca en texto e imágenes
- 1.4 Valores y compromiso sostenible
- 1.5 Equipo en tarjetas
- 1.6 Footer reutilizado
BLOG
- 1.1 Header reutilizado
- 1.2 Lista de artículos en cards con imagen, título y extracto
- 1.3 Barra lateral con categorías y newsletter
- 1.4 Footer reutilizado
CONTACT
- 1.1 Header reutilizado
- 1.2 Formulario de contacto con campos nombre, email, mensaje
- 1.3 Mapa embed
- 1.4 Footer reutilizado
PROMPTS RELACIONADOS · E-COMMERCE
