Kinetic orb gallery
A Canvas 2D collection with horizontal dragging, arrow keys, object selection, and adjustable orbit spread. Original procedural textures work offline, and reduced motion stops automatic rotation.
Live demo
Interactive demoDrag horizontally to rotate. Use arrow keys or swatches to select objects, and the slider to adjust orbit spread.
Open preview in a new windowMake this effect yours
Includes Skill instructions, a Python generator, an HTML template, design notes, and an offline preview. Requires Python 3.10+ with no additional dependencies. Supports custom text and colors, keyboard controls, and reduced motion.
Download SKILL.md only- Download and unzip
Keep the
kinetic-orb-gallery/folder. ItsSKILL.mdfile is the Skill entry point, and scripts/ contains the generator, templates/ the HTML template, and references/ the design notes. Open preview.html directly in your browser. - Give it to your AI coding assistant
Add the folder to your project and ask your assistant to read SKILL.md. If your tool supports Skills, follow its installation method.
- Describe the result you want
Read kinetic-orb-gallery/SKILL.md and generate out/index.html with brand Shape Studies, title Objects in motion, accent #b64828, and speed 0.4. Check dragging, object selection, and the orbit spread slider.
