NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia "Market Cobalto" (dominio marketcobalto.com) siguiendo el estilo visual de la plantilla analizada. Usa HTML estático en un solo archivo, Tailwind CSS vía CDN y JavaScript vanilla (sin frameworks). Paleta de colores: #0D0D0D (negro profundo), #FFFFFF (blanco), #F5A623 (ámbar), #E5E5E5 (gris claro), #333333 (gris medio). Tipografía: Inter (sans) para títulos y body, peso 400‑700.
Estructura:
- **Header** sticky, fondo blanco, borde inferior sutil, contiene logo a la izquierda, íconos sociales (Twitter, LinkedIn, Instagram, Dribbble) a la derecha, y botón de carrito que abre un modal.
- **Hamburger menu** (ícono de tres líneas) a la izquierda del header que despliega un panel lateral con enlaces: "Inicio", "Sobre nosotros", "Productos", "Con
4.306 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.306 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 sticky con logo, iconos sociales y acceso al carrito
- 1.2 Menú hamburguesa lateral con enlaces de navegación
- 1.3 Hero principal con título, subtítulo y botón
- 1.4 Grid de productos destacados
- 1.5 Slider de categorías
- 1.6 Sección de testimonios
- 1.7 Contador de métricas
- 1.8 Footer informativo
ABOUT
- 2.1 Cabecera idéntica a la home
- 2.2 Imagen grande con texto descriptivo de la marca
- 2.3 Equipo en cards horizontales
- 2.4 Valores en iconos con breve descripción
- 2.5 Footer
PRODUCTS
- 3.1 Cabecera
- 3.2 Lista de categorías en tabs
- 3.3 Grid de productos con botón "Añadir al carrito"
- 3.4 Paginación
- 3.5 Footer
PRODUCT DETAIL
- 4.1 Cabecera
- 4.2 Galería de imágenes del producto
- 4.3 Información del producto, precio y botón de compra
- 4.4 Productos relacionados en carousel
- 4.5 Footer
CART
- 5.1 Cabecera
- 5.2 Modal de carrito con listado de ítems, cantidades editables y subtotal
- 5.3 Botón de checkout y enlace a continuar comprando
- 5.4 Footer minimalista
CHECKOUT
- 6.1 Cabecera
- 6.2 Formulario de datos de facturación y envío
- 6.3 Resumen de compra y botón de pago
- 6.4 Footer
PROMPTS RELACIONADOS · E-COMMERCE