webgl-aurora-veil
A self-contained WebGL2 hero: layered aurora light curtains warped over a night sky scattered with stars; move the cursor to sway the veil.
- License 许可
- MIT
- 最近更新
- 2026-11-14
- Stars
- ★ 1.1k
- Forks
- 104
01 前言 Front Matter
- od
- { "mode": "prototype", "craft": { "requires": [ "animation-discipline" ] }, "preview": { "type": "html", "entry": "index.html", "reload": "debounce-100" }, "platform": "web", "scenario": "design", "design_system": { "requires": false } }
- name
- webgl-aurora-veil
- triggers
- [ "aurora veil", "webgl hero" ]
- description
- A self-contained WebGL2 hero: layered aurora light curtains warped over a night sky scattered with stars; move the cursor to sway the veil.
02 资源文件 2
- 参考文档example.html5.8 KB
- 参考文档open-design.json2.5 KB
03 SKILL.md 正文
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).
04 同仓库更多 Skills
youtube-clipper
YouTube clip generation and editing with automated workflows — pull source video, slice highlights, add captions, and export.
writing-guidelines
Review docs/prose for Writing Guidelines compliance. Use when asked to "review my docs", "check writing style", "audit prose", "review docs voice and tone", or "check this page against the writing handbook".
wpds
WordPress Design System. Apply WordPress's official design tokens, typography, and component patterns to themes and sites.
weread-year-in-review-video-template
WeRead-inspired HyperFrames video template for vertical annual reading reports, personal reading dashboards, book-note recaps, and shareable year-in-review stories. Use when users want a 9:16 HTML-to-MP4 reading report with warm paper texture, editorial Chinese typography, book-page metaphors, data highlights, and deterministic motion.
web-design-guidelines
Review UI code for Web Interface Guidelines compliance by the Vercel engineering team. Covers layout, typography, color, motion, and accessibility for product UI.
web-clone
网站复刻 / 克隆方法论。USE WHEN 用户说 复刻网站、克隆网站、clone website、抄个站、仿站、 照着这个站做一个、reproduce site、还原某个网页效果、把这个站搬下来改成我的、 复刻某个交互/WebGL/Canvas/Three.js 效果。提供「先拿真源码 → 判路径 → 逆向拆解 → 搭工程 → 替换内容」的可移植决策树，覆盖静态站 / React-Vue-Next 内容站 / WebGL-Canvas 重前端站三大分支，并强制核对任何 AI 二手分析里的可执行代码。