NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia **Compras Andina** (comprasandina.com) usando únicamente **HTML** y **Tailwind CSS CDN** (https://cdn.tailwindcss.com) y **JavaScript vanilla** en un solo archivo. El proyecto debe reproducir fielmente la estructura y el estilo visual del template analizado, sin copiar textos ni imágenes originales.
**Objetivo**: Tienda de cosmética premium, categoría "Comercio electrónico".
**Paleta de colores** (extraída del original):
- Primario: #1A1A1A (casi negro)
- Secundario: #FFFFFF (blanco)
- Accent 1: #C71D5E (rosa profundo)
- Accent 2: #F2C94C (amarillo dorado)
- Fondo suave: #F9F9F9
**Tipografía**: Usar Google Fonts "Montserrat" (peso 400, 500, 700) para todo el texto; encabezados en **Montserrat Bold**, cuerpo en **Montserrat Regular**.
**
5.331 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
5.331 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, buscador, enlace a tienda, icono usuario y carrito
- 1.2 Barra de navegación principal con logo, enlaces (About, Categories, Shop, Blogs, Resources dropdown, Contact), buscador móvil y zona derecha
- 1.3 Hero principal (imagen grande con call‑to‑action)
- 1.4 Sección de categorías destacadas en grid de tarjetas
- 1.5 Sección de productos recomendados en carrusel
- 1.6 Testimonios o últimas publicaciones del blog
- 1.7 Footer con columnas: Sobre nosotros, Ayuda, Legal, Redes sociales
ABOUT US
- 2.1 Cabecera idéntica a Home
- 2.2 Hero interno con título y texto descriptivo
- 2.3 Texto histórico y valores de la marca
- 2.4 Equipo o staff en grid
- 2.5 Footer
CATEGORIES
- 3.1 Cabecera idéntica
- 3.2 Lista de categorías en tarjetas con imagen y enlace
- 3.3 Filtro lateral (opcional) y paginación
- 3.4 Footer
SHOP
- 4.1 Cabecera idéntica
- 4.2 Filtro y ordenación de productos
- 4.3 Grid de productos con imagen, nombre, precio y botón añadir al carrito
- 4.4 Paginación
- 4.5 Footer
BLOGS
- 5.1 Cabecera idéntica
- 5.2 Lista de artículos en tarjetas con imagen, título, extracto y fecha
- 5.3 Sidebar con categorías y últimos posts
- 5.4 Footer
CONTACT US
- 6.1 Cabecera idéntica
- 6.2 Formulario de contacto con campos nombre, email, asunto y mensaje
- 6.3 Mapa incrustado (opcional)
- 6.4 Footer
PROMPTS RELACIONADOS · E-COMMERCE