COMERCIO ELECTRÓNICO · Claude Design · HTML

Store Helio — Prompt de diseño web para Claude AI

★★★★★4,8 2.912 descargas

Tienda online de productos de estilo de vida y decoración Objetos que inspiran tu día a día.

↓ Descargar PROMPT.md

GRATIS 0€

NUEVO PROMPT

PROMPT

Cópialo y pégalo en Claude Design

↓ Descargar PROMPT.md

Crea un sitio web completo para la marca ficticia Store Helio (storehelio.com) usando HTML estático, Tailwind CSS CDN y JavaScript vanilla en un solo archivo. La web es una tienda de estilo de vida y decoración (categoría: Comercio electrónico). Reproduce la estructura visual observada: 
- Header fijo con logo a la izquierda, menú principal (Home, About, Shop, Blog, Contact) centrado y botón de carrito con contador a la derecha. El carrito abre como modal overlay con lista de productos, cantidades editables, subtotal y botones "Continuar" y "Ver Todo".
- Paleta de colores: #1F2937 (gris oscuro), #4B5563 (gris medio), #9CA3AF (gris claro), #FBBF24 (amarillo dorado), #FFFFFF (blanco).
- Tipografía: Inter (Google Fonts) para todo el texto, peso 400 regular y 600 semibold para encabezados.
- H

┬±┴┴φ√┬ε ╔↔φφ≤╗◘ ┬▓╚╔┤▀╗ ╣∩↑µΣτ╠ ╗→≡└◘╠α ⁿ•σ↓µ─♠ ╚┤▓◘∩τ
 ∞▒π↑πΣ≤ δ┤▒♦╦┬■ ▒µ≡µΦΣ└ ├♦╠░╡│═ Φ│═╠Ω╔◙ ╩◙█Σ┴╩╦ •◙πδ♦
╔ ├║≡ε░Ω└ ◙∩≡•±╚δ ↓ß▀■▒║┼ ╗║◙τ²σ↔ ∞├▀◘Σ╗╬ Ω┤▒√◘φß ←◘╣ß
²♦ └ß◙╣←²↓ φ↑╝♦╦╫ⁿ ↓╔░≡∩→♣ └╡♦αµφ╔ ┼∩┴▀║╚↔ ╚╝♠↔√╗▓ •→╝
╝┬≥ ╩♣╝♠≡░└ ─╬▀≤♦Ω← µΦ≡∩░═╔ ◙∞░Φ╦╗≤ π◙√◘◙─▓ │◙δ≥α↑→ δ╗
τ╫α─ ≡♣┴←├╫▒ ╫↓┴▀♣■║ ┼◙α└╡╬╬ ±◙╠╚┴┴♦ ╗┼π±╝▓ⁿ Σ♣↑╩±εΦ ≡
σΣ←┼← ←╗ⁿ♠◙▓τ ▒╔²─Σ♦ε πφ▀α╚→µ σεφ◘▓▒╗ ─∞╣◘•↓π ◘•├≡╣╚α 
∩π♠├├█ ◘±┤╩◘²δ Ωσ∩ε─∩│ ∩ⁿσ╠♣╚≡ ⁿ└╗Σ╚╬♦ ≥╔╩╠±≡↔ →↓▒Ωπ─╗
▀╬╝ⁿ╣≤≡ σ→→┬Ω↓τ ■ε↔≤◘→┴ ∩◘─╬α≥π ≥σ└σ◙╝╬ ╗◙◙│╝δß ²─╚≡δ╬
 ╝♣▀↑σ┼Σ ╗•└τ└╫╬ ╦σ←∩♠δ≥ ═σα∞╬╫ß ≥Ω╗←τ♠╚ ß▀φ²√²α ∩╣◘╫√
→ ▓↓Φ│σ≥α ↑╝ß╚ⁿ└└ ║║∩├─┼◘ ┴↔└τµ╩╫ ┼π─┴└τⁿ ╦┴Ω╡√│■

4.022 caracteres · solo descargable completo ↓ Descargar PROMPT.md completo

4.022 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ú principal y botón de carrito modal
1.2 Hero de página de inicio con fondo de imagen completa y título
1.3 Bloque de categorías resaltadas en cuadrícula
1.4 Sección de productos destacados con carrusel horizontal
1.5 Área de testimonios con citas y fotos de clientes
1.6 Llamada a la acción para suscripción al boletín
1.7 Footer con enlaces de navegación, datos de contacto y redes sociales

ABOUT

2.1 Cabecera reutilizada
2.2 Hero con imagen y texto descriptivo de la marca
2.3 Sección de valores y misión en columnas
2.4 Equipo en tarjetas con foto y biografía corta
2.5 Footer reutilizado

SHOP

3.1 Cabecera reutilizada
3.2 Barras de filtro y ordenación de productos
3.3 Cuadrícula de productos con imagen, nombre, precio y botón "Agregar al carrito"
3.4 Paginación inferior
3.5 Footer reutilizado

PRODUCT DETAIL

4.1 Cabecera reutilizada
4.2 Imagen principal del producto con galería de miniaturas
4.3 Información del producto: título, descripción, precio, selector de variante y botón "Añadir al carrito"
4.4 Sección de productos relacionados en carrusel
4.5 Footer reutilizado