NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia Tienda Polar, tienda online de cosméticos, usando HTML estático, TailwindCSS vía CDN y JavaScript vanilla en un único archivo. El proyecto debe reproducir la estructura y estilo del sitio analizado, sin copiar texto literal.
---
**Paleta de colores**
- Primario: #C86C9B (rosa suave)
- Secundario: #2C2C2C (gris carbón para texto)
- Fondo: #FFFFFF
- Accent: #F5E8EF (rosa muy claro para fondos de tarjetas)
**Tipografía**
- Fuente principal: "Inter", sans-serif (cargada desde Google Fonts).
- Fuente de títulos: "Playfair Display", serif.
**Header**
- Barra superior con logo (texto Tienda Polar) a la izquierda.
- Menú de navegación horizontal con enlaces: Inicio, Nuestra historia, Tienda, Blog, Contacto.
- Ícono de búsqueda que abre overlay c
4.598 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.598 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, menú, buscador y carrito modal
- 1.2 Hero a pantalla completa con imagen de fondo y llamada a acción
- 1.3 Productos destacados en cuadrícula
- 1.4 Categorías con iconos
- 1.5 Testimonios en carrusel
- 1.6 Suscripción al boletín
- 1.7 Footer con información institucional y contactos
SOBRE NOSOTROS
- 2.1 Cabecera (reutiliza la misma que Home)
- 2.2 Imagen grande de portada con título "Nuestra historia"
- 2.3 Texto descriptivo sobre la marca y su filosofía
- 2.4 Equipo (grid de fotos con nombre y cargo)
- 2.5 Footer
TIENDA
- 3.1 Cabecera
- 3.2 Banner de categoría
- 3.3 Filtros laterales (por tipo, precio, marca)
- 3.4 Listado de productos (tarjetas con imagen, nombre, precio, botón añadir)
- 3.5 Paginación
- 3.6 Footer
BLOG
- 4.1 Cabecera
- 4.2 Lista de artículos (tarjetas con imagen, título, excerpt, fecha)
- 4.3 Sidebar con categorías y últimas entradas
- 4.4 Footer
CONTACTO
- 5.1 Cabecera
- 5.2 Formulario de contacto (nombre, email, mensaje, botón enviar)
- 5.3 Mapa incrustado
- 5.4 Información de contacto y redes
- 5.5 Footer
PROMPTS RELACIONADOS · E-COMMERCE
