scrollY0
progresso A0%
progresso B0%
pin ativo—
DEMO — Mecânica Kilograph

Tira horizontal scroll-driven

Role a página verticalmente. A tira de swatches + fotos abaixo vai deslizar na horizontal, presa (pinada) na tela enquanto você rola — mesmo comportamento identificado no material da referência.

role para baixo
CINNAMON
Escada e clarabóia — textura de referência textura ref.
CREAM
Painel de madeira — textura de referência textura ref.
Variação B — identidade DNAi Render

Mesma mecânica, roupa da marca

A partir daqui, mesmo comportamento de scroll (pin + translate horizontal), mas com preto #0A0A0C, dourado #C7A050 e tipografia Inter do site DNAi Render.

ONYX
Interior arquitetônico escuro — textura de referência textura ref.
GOLD LEAF
Textura de material escuro — referência textura ref.
Fim do demo

Mecanismo validado

As duas tiras acima usam o mesmo motor: GSAP ScrollTrigger com pin:true e scrub, sem autoplay. Veja o HUD no canto superior direito durante o scroll — ele mostra o progresso real de cada tira em tempo real.