Skip to content
Skillpedia
Images & icons101k · #591

webgl-aurora-veil

Lets your agent create moving aurora borealis light visual effects. It's useful for making dynamic and stunning backgrounds for websites or presentations.

What it does

This code creates a beautiful aurora borealis light animation in a starry sky. You can move your mouse to make the lights sway.

When to use it

  • ✓To decorate a webpage with a visual effect.
  • ✓To create an animated background for a project.
  • ✓To demonstrate graphics technology in the browser.

Example of what to ask your AI

“Create an aurora borealis animation for my website.”

Want more? Open the sections below.

How to use

The easiest way: copy the message below and paste it into Claude, ChatGPT, Cursor or any AI. It reads the skill and follows the instructions.

Skill link

https://github.com/nexu-io/open-design/blob/main/plugins/_official/examples/webgl-aurora-veil/SKILL.md

Ready-to-paste message

Use this skill to help me: https://github.com/nexu-io/open-design/blob/main/plugins/_official/examples/webgl-aurora-veil/SKILL.md Read the SKILL.md file at that link and follow its instructions for my task.
How it works

It uses a technology called WebGL2 to draw the lights directly in your browser. When you move your mouse, the code adjusts the lights' position.

Installation

Easiest way: copy the skill link and paste it into Claude, ChatGPT or Cursor asking it to follow the instructions.

In the terminal (Claude Code, Codex, Cursor), in your project folder:

npx skills add nexu-io/open-design --skill webgl-aurora-veil

Or download just the file:

curl -L https://raw.githubusercontent.com/nexu-io/open-design/main/plugins/_official/examples/webgl-aurora-veil/SKILL.md -o SKILL.md
Technical content (original SKILL.md)

Original text by the author, straight from GitHub.

Aurora Veil

Produce a single self-contained index.html — A self-contained WebGL2 hero: layered aurora light curtains warped over a night sky scattered with stars; move the cursor to sway the veil.

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

webgl-aurora-veil/
├── 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).

FAQ

What is WebGL2?

It's a way to draw complex graphics and animations directly in your web browser, using your graphics card's power.

Do I need to install anything to see the animation?

No, everything works directly in the browser. You just need an HTML file containing the code.

Can I change the aurora's colors?

The original code doesn't make it easy to change colors, but a programmer could adapt it to do so.

Details

Original description by the author

A self-contained WebGL2 hero: layered aurora light curtains warped over a night sky scattered with stars; move the cursor to sway the veil.

repo: nexu-io/open-design

Popularity

GitHub stars
101k
Ranking position
#591
License
Apache-2.0
Updated
10/16/2026

Is this skill useful?

0

Sign in to vote.

Comments

  • …

More skills from this repository

Similar skills