Skip to content

3D Sky Rays

Adds sun shafts and light rays through gaps in 3D scenes (Three.js and similar)

Repository
MengTo/Skills
Stars
7,187
Licence
MIT
Files
3 files

What it does

When installed, the agent knows a specific technique for making sunlight look like it streams through gaps in roofs and foliage in a 3D scene. It guides the agent to inspect an existing renderer, build an occlusion-aware screen-space ray effect, project the sun's position, and tune it for appearance and performance. It is a set of instructions and shader guidance rather than a finished tool.

Great for

  • Developers building Three.js or WebGL/WebGPU scenes who want golden-hour sunlight shafts
  • Artists or technical designers tuning atmospheric lighting in architectural or nature visualisations

Skip it if

  • Projects that do not render 3D graphics, since the skill has no use outside a real-time rendering pipeline
  • Teams needing physically accurate volumetric scattering; the skill itself says it is an artistic approximation, not depth-integrated volumetric lighting

Try asking

  • “Add sun shafts through the tree canopy in my Three.js forest scene”
  • “Make golden-hour light stream through the roof gaps in this architectural viewer”
  • “Implement a screen-space god ray pass that respects foliage alpha cutouts”
Step-by-step guide: how to use 3D Sky RaysInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 3 original files, the MIT licence and an attribution note.

    3d-sky-rays.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip 3d-sky-rays.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip 3d-sky-rays.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Give the agent your renderer version and current post-processing setup so it can follow the 'fit the existing renderer' steps
  • Start with low sample counts and a half-resolution ray buffer, then increase only if banding appears
  • Ask the agent to verify with the listed checks, including reduced-motion and mobile frame time

What's inside

  • agents/openai.yaml
  • REFERENCES.md
  • SKILL.md

Redistributed unmodified from MengTo/Skills under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.