3D and WebGLLocal editorial record

Add shader cursor trail

Add the Shaders WebGPU mouse effect used for the Tidal Commons hero: a white twinkling halftone cursor trail driven by ChromaFlow, masked through a DotGrid, finished with chromatic ripples a

Catalog record

Installable source artifact

This page explains the direction locally, then links to the exact upstream artifact and its verified install command.

What this gives you

A clearer brief for the agent.

Gives immersive surfaces a compositional role, with clear framing, depth, and fallback behavior.

Expected result

A 3D-led interface that supports the message instead of competing with it.

Use it when

A product or campaign needs a visual centerpiece with depth or real-time graphics.

Source repository stars

4.9K

Source repository · verified 2026-08-17

Install status

Installable source artifact

add-shader-cursor-trail · Skills CLI

Install this skill with one command.

This exact source artifact can be installed in your project with the Skills CLI.

$npx skills add https://github.com/MengTo/Skills --skill add-shader-cursor-trail

Skill name: add-shader-cursor-trail · installs into the agent directory selected by the CLI.

Open source SKILL.md Read install guidance

Related directions

Continue inside DesignMD.

Ambient section particlesAdd a restrained particle atmosphere inside one section with configurable shapes, density, gravity, wind, sway, rotation, recycling or settling, pointer disturbance, visibility pausing, resp Background grid WebGLCreate a perspective WebGL background grid with fading lines, subtle particle haze, slow forward drift, and gentle camera parallax.Cobe.jsjs).Corner lasersCreate a corner-anchored laser composition with thin beams, a bright emitter node, bloom, and atmospheric glow or fog.