New to Claude Skills? Learn how to install them →

nexu-io on GitHub

Voronoi Cells

Free

Create interactive WebGL2 Voronoi diagrams easily.

by nexu-io84.9k stars on nexu-io/open-design
5 views
Updated Aug 10, 2026
Get this skill

Free · Opens the source repo

What Voronoi Cells does

The Voronoi Cells skill provides a straightforward way to generate a self-contained WebGL2 visualization of a Voronoi network. This skill produces a single index.html file that features a dynamic Voronoi diagram, where the cells respond to cursor movements, creating an engaging visual experience. The cells are palette-keyed and have glowing boundaries, enhancing the aesthetic appeal of the diagram. The drifting feature points add a layer of interactivity, making it suitable for projects that require visual representation of spatial data or artistic exploration.

This skill is particularly useful for developers and designers looking to incorporate interactive graphics into their applications or websites without the need for extensive WebGL knowledge. The self-contained nature of the output means that users can easily integrate the generated HTML file into their projects, ensuring a smooth implementation process. The skill also leverages the capabilities of WebGL2, allowing for efficient rendering and a high-quality visual output.

With Open Design's powered preview feature, this skill ensures that the WebGL content is rendered correctly in a cross-origin-isolated iframe, which means users can expect reliable performance without the limitations of opaque-sandbox workarounds. This makes it an excellent choice for those who want to showcase complex visualizations in a web environment, as it fully utilizes the GPU and scroll pipeline for optimal rendering performance.

Overall, Voronoi Cells is a valuable tool for anyone interested in creating interactive visualizations using WebGL2, whether for educational purposes, artistic projects, or data representation.

When to use it

Use this skill when you need to create engaging, interactive visualizations for web applications or presentations.

When not to use it

This skill may not be suitable for projects that require more complex interactions or additional features beyond the basic Voronoi visualization.

What you can build with it

Interactive Data Visualization

Use the Voronoi Cells skill to create engaging visual representations of spatial data, enhancing user interaction.

Artistic Projects

Incorporate this skill into art projects that require dynamic and visually appealing graphics.

Web Presentations

Utilize the generated Voronoi diagrams in web presentations to illustrate complex concepts visually.

How to install Voronoi Cells

View source

1. Install with the skills CLI

npx skills add nexu-io/open-design/webgl-voronoi-cells --agent claude-code

2. Or install it manually

Download the skill folder and drop it into ~/.claude/skills/ for all projects, or .claude/skills/ to scope it to one repo. Restart Claude Code so it picks up the new skill.

Anthropic's agentic coding CLI, and the reference implementation of Agent Skills. Drop a skill folder into ~/.claude/skills and Claude Code loads it automatically whenever a task matches the skill's description. Claude Code docs

Inside SKILL.md

Written by nexu-io

Voronoi Cells

Produce a single self-contained index.html — A self-contained WebGL2 hero: a living Voronoi network with drifting feature points, palette-keyed cells and glowing boundaries; move the cursor to push the cells.

Why this is a powered artifact

Open Design 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

webgl-voronoi-cells/
├── SKILL.md          ← you're reading this
├── example.html      ← the complete, working artifact (READ FIRST)
└── (assets, if any)

Credits / attribution

  • Original, self-contained (no third-party assets).

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).

Frequently asked questions about Voronoi Cells

Similar skills