Agent skill · design visual · nexu-io
webgl-horizontal-parallax
A horizontal-scroll WebGL gallery (Three.js): frames glide sideways with lerp smoothing and each image parallaxes its texture (UV shift) by its position in the viewport.
Why this skill is useful
Provides a specific implementation of a horizontal-scroll WebGL gallery using Three.js, which includes unique techniques for texture parallaxing that the AI may not generate on its own.
What it needs
About 1k tokens when loaded. Last updated 2026-08-07. 84,236 stars on the source repository.
What this skill does
Horizontal Parallax Gallery Produce a single self-contained index.html — A horizontal-scroll WebGL gallery (Three.js): frames glide sideways with lerp smoothing and each image parallaxes its texture (UV shift) by its position in the viewport. Why this is a powered artifact OpenDesign detects getContext('webgl2') / heavy WebGL and renders this file in powered preview (a cross-origin-isolated iframe). The full GPU + scroll pipeline runs; no opaque-sandbox workarounds are needed. Resource map Credits / attribution effect: David Faure / Codrops (MIT) imagery: Original (AI-generated) Keep any bundled LICENSE and on-screen credit intact. Replace imagery only with license-clean assets (original / AI, Lummi.ai, Unsplash/Pexels — never scraped imagery).
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills nexu-io/webgl-horizontal-parallax