---
title: "Diseño web para marcas de moda y streetwear | Grafito — hero con cursor"
description: "Diseño web para marcas de moda urbana y colecciones cápsula: hero a pantalla completa gobernado por el cursor, galería de producto dispersa enlazada al scroll y cero librerías pesadas. Mira la demo del tema Grafito y pide tu web de marca."
lang: es-ES
source_url:
  html: https://logic2b.com/templates/grafito/
  md: https://logic2b.com/templates/grafito/index.md
---

Ruta: [Plantillas](https://logic2b.com/templates) › [Tiendas online y ecommerce](https://logic2b.com/diseno-web/tiendas-online) › Grafito

Demo navegable · Moda urbana y colecciones cápsula

# Grafito Plantilla para moda urbana y colecciones cápsula.

Hero gobernado por el cursor (dos vídeos que se funden) + galería de producto dispersa que escala con el scroll.

[Ver demo en vivo (se abre en una pestaña nueva)](https://logic2b.com/templates/grafito/live)

**Piezas incluidas**

8

**Estilos**

3

**Sectores**

2

Grafito · demo navegable [Abrir aparte (se abre en una pestaña nueva)](https://logic2b.com/templates/grafito/live)

## Diseño web para moda urbana y colecciones cápsula

Plantilla editorial para marcas de moda urbana y colecciones cápsula: hero a pantalla completa donde el cursor funde dos vídeos del producto, un panel negro que sube desde abajo hasta cubrir la pantalla y una galería dispersa de piezas que escalan al entrar y salir del encuadre, todo enlazado al scroll sin saltos. Cierre en blanco con precio y CTA «ver» que sella la pieza como una edición de archivo, no un catálogo más.

**Grafito** es una demo navegable para moda urbana y colecciones cápsula. Está pensada para que quien entra entienda rápido qué ofrecéis y acabe contactando o reservando; la adaptamos a vuestra marca, vuestros textos y vuestros servicios.

La demo está construida con Astro y Svelte, el mismo stack que usamos en producción. En todos cuidamos lo mismo: carga rápida, HTML semántico y contenidos bien estructurados para que vuestro negocio se encuentre en buscadores y asistentes de IA.

### Qué incluye

1. Hero con dos vídeos que se funden según la posición del cursor
2. Zona muerta central + guarda anti-parpadeo (currentTime solo si no está buscando)
3. Panel negro que sube desde abajo hasta cubrir la pantalla
4. Galería de producto dispersa: cada pieza escala al entrar y salir del encuadre
5. Todo enlazado al scroll con un único bucle requestAnimationFrame
6. Cursor a medida y textos en mezcla «exclusion» (legibles sobre cualquier fondo)
7. Cierre en blanco con precio, CTA «ver» y pie editorial
8. Móvil: vídeos alternos autoreproducidos, sin cursor ni scrub

Ficha del tema

**Sector**

Moda urbana y colecciones cápsula

**Estilo**

Editorial · Moda · Vídeo

**Stack**

Astro + Svelte

**Entrega**

Publicada en vuestro dominio

Sectores

- [Tiendas online y ecommerce](https://logic2b.com/diseno-web/tiendas-online)
- [Moda y marcas de autor](https://logic2b.com/diseno-web/moda)

Lo adaptamos a vuestra marca y lo publicamos en vuestro dominio. Precio cerrado tras una llamada.

## Temas relacionados. Del mismo sector o con estilos en común.

[Ver todos](https://logic2b.com/templates)

### [Pupila](https://logic2b.com/templates/pupila)

Ópticas y gafas de autor

### [ARCE](https://logic2b.com/templates/ecom-arce)

Mobiliario contemporáneo

### [BRUMA](https://logic2b.com/templates/ecom-bruma)

Café de especialidad

## La web vende. El sistema sirve el pedido.

Una tienda online se juega el margen detrás del escaparate: búsqueda interna, stock y personalización. Estas demos enseñan hasta dónde lo llevamos a medida.

[Sistemas de tiendas online y ecommerce](https://logic2b.com/diseno-web/tiendas-online#sistemas)

1. Necesidad 01 · Inventario y almacén
   **[Pedidos, preparación y devoluciones](https://logic2b.com/lab/albaran)**
   Del pedido pagado a su entrega: oleadas de picking sobre el almacén, transportista por peso y destino y devoluciones con su reembolso de demostración.
2. Necesidad 02 · Comercio y buscadores
   **[Buscador que entiende al cliente](https://logic2b.com/lab/tesela)**
   Búsqueda con corrección de erratas y un orden de resultados que podéis explicar y ajustar, sin pagar un servicio externo por consulta.
3. Necesidad 03 · Comercio y buscadores
   **[Configurador de producto](https://logic2b.com/lab/pespunte)**
   Personalización visual —colores, nombre, piezas— con el pedido exportado listo para producción.

Sistemas a medida de

- [Inventario y almacén](https://logic2b.com/sistemas/inventario-almacen)
- [Comercio y buscadores](https://logic2b.com/sistemas/comercio-buscadores)

---

Logic2b S.L. · Castellón (España) · [info@logic2b.com](mailto:info@logic2b.com) · [Contacto](https://logic2b.com/contacto/) · [Auditoría gratuita](https://logic2b.com/auditoria/) · [Índice para IA](https://logic2b.com/llms.txt)