Updated today
by scottstts
Threejs-Awesome-Graphics-Agent-Skills
A three.js agent skills for producing awesome graphics for scenes and games
908 GitHub stars (908)
+52 in 20 days
| Period | New stars |
|---|---|
| Sep 27 | 0 |
| Sep 28 | +2 |
| Sep 29 | +2 |
| Sep 30 | +7 |
| Oct 1 | 0 |
| Oct 2 | +2 |
| Oct 3 | 0 |
| Oct 4 | +1 |
| Oct 5 | +1 |
| Oct 6 | +4 |
| Oct 7 | +3 |
| Oct 8 | +5 |
| Oct 9 | +2 |
| Oct 10 | +2 |
| Oct 11 | +3 |
| Oct 12 | +4 |
| Oct 13 | +4 |
| Oct 14 | +2 |
| Oct 15 | +5 |
| Oct 16 | +3 |
- 24 skills (24 skills found in its SKILL.md files)
- 98 forks (98 forks)
- Today last update (Last updated today)
Install
Skills CLI
npx skills add scottstts/Threejs-Awesome-Graphics-Agent-Skills
Asks which skills and agents to install. Just one: npx skills add scottstts/Threejs-Awesome-Graphics-Agent-Skills --skill threejs-atmosphere-aerial-perspective — add -g for every project.
Claude Code
git clone https://github.com/scottstts/Threejs-Awesome-Graphics-Agent-Skillscp -r "Threejs-Awesome-Graphics-Agent-Skills/skills/threejs-atmosphere-aerial-perspective" ~/.claude/skills/
Copies the threejs-atmosphere-aerial-perspective skill into ~/.claude/skills/ for every project (use .claude/skills/ for one project). Repeat for the other skills listed below.
Plugin
/plugin marketplace add scottstts/Threejs-Awesome-Graphics-Agent-Skills
Run inside Claude Code if the repository ships a plugin marketplace, then pick plugins from /plugin.
Skills can run code on your machine — read the SKILL.md first.
What it does
In the author's own words, from each skill's SKILL.md.
-
threejs-atmosphere-aerial-perspective
Implement physically motivated sky and aerial-perspective systems in Three.js. Use for planetary atmospheres, ground-to-space transitions, Rayleigh/Mie scattering, precomputed LUTs, depth-based transmittance and inscattering, sun/moon discs, and atmosphere-aware lighting.
skills/threejs-atmosphere-aerial-perspective/SKILL.md on GitHub (opens in a new tab) -
threejs-bloom
Implement production bloom in advanced Three.js scenes. Use for HDR signal ordering, bloom-node controls, dual selective bloom with guaranteed material restoration, scene-relative emissive hierarchy, and effect-isolation diagnostics.
skills/threejs-bloom/SKILL.md on GitHub (opens in a new tab) -
threejs-camera-direction
Direct advanced Three.js camera systems. Use for scale-aware chase rigs, thrust lag, side/orbit cameras, body-relative up vectors, quaternion handoffs, authored cinematic framing, floating origins, pointer-look controls, camera collision constraints, projection ownership, and lifecycle restoration.
skills/threejs-camera-direction/SKILL.md on GitHub (opens in a new tab) -
threejs-exposure-color-grading
Build a measured exposure and grading path in Three.js. Use for a 64x36 encoded luminance meter, asynchronous readback, weighted log-average exposure, asymmetric adaptation, single tone-map ownership, and a generated 32-cube post-tone-map LUT.
skills/threejs-exposure-color-grading/SKILL.md on GitHub (opens in a new tab) -
threejs-image-pipeline
Build a deliberate final-image pipeline for advanced Three.js scenes. Use for depth, normal, albedo, and history ownership; GTAO or bent normals; bloom; eye adaptation; tone mapping; 3D LUT grading; effect-local render targets; and pass diagnostics.
skills/threejs-image-pipeline/SKILL.md on GitHub (opens in a new tab) -
threejs-parallax-occlusion-mapping
Build silhouette-aware parallax occlusion mapping in Three.js WebGPU and TSL. Use for height-field ray marching, relief UVs, clipped flat or curved silhouettes, inflated shells, self-shadowing, relief-aware shadow depth, and height-derived normals.
skills/threejs-parallax-occlusion-mapping/SKILL.md on GitHub (opens in a new tab) -
threejs-precipitation-surfaces
Build coupled precipitation and affected surfaces in Three.js. Use for falling snow, snow accumulation, model snow caps, wet asphalt puddles, procedural ripple normals, splash flipbooks, rain streaks, shared weather envelopes, and surface wetness or coverage transitions.
skills/threejs-precipitation-surfaces/SKILL.md on GitHub (opens in a new tab) -
threejs-procedural-animation
Build advanced procedural animation in Three.js. Use for launch kinematics, gravity turns, staging, spin docking, target-frame decomposition, spring-follow motion, rotating-frame alignment, peeling debris, analytic transform timelines, frame-rate-independent response, and quaternion control.
skills/threejs-procedural-animation/SKILL.md on GitHub (opens in a new tab) -
threejs-procedural-architecture
Build authored procedural buildings and architectural kits in Three.js. Use for massing grammars, exposed-edge analysis, façade bays, profiles, arches, cornices, roofs, ornaments, material-slot mesh compilation, deterministic variants, and procedural city assets.
skills/threejs-procedural-architecture/SKILL.md on GitHub (opens in a new tab) -
threejs-procedural-fields
Build coherent procedural scalar and vector fields for Three.js materials and geometry. Use for terrain, planets, wear, biomes, clouds, water masks, displacement, roughness, normals, domain warping, and any visual where several channels must derive from shared causes.
skills/threejs-procedural-fields/SKILL.md on GitHub (opens in a new tab) -
threejs-procedural-geometry
Build well-crafted production procedural meshes in Three.js. Use for complete hard-surface assemblies and humanoid robots, profile extrusion, parameter-curve and spine lofts, pillow panels, exact polygon cuts, inset, revolve, sweep, solidify, bevels and fillets, shell thickness, direct-topology apertures, semantic mesh writers, or diagnosing primitive-built forms, coplanar flicker, loose/non-mani…
skills/threejs-procedural-geometry/SKILL.md on GitHub (opens in a new tab) -
threejs-procedural-materials
Author production procedural materials in Three.js. Use for hybrid texture-backed PBR soil and moss with procedural displacement and masks, upward-facing model moss accumulation, atlas filtering, specular AA, planet-space fields, terrain wetness, deformable granular sand with mass-coupled grain shading, woven cloth with GPU XPBD mechanics and yarn microstructure, simulated fur with interactive gr…
skills/threejs-procedural-materials/SKILL.md on GitHub (opens in a new tab) -
threejs-procedural-planets
Author procedural planetary bodies in Three.js. Use for spherical terrain, continents, ridges, craters, biome masks, coastlines, material variation, analytic normals, altitude LOD, and bodies that must hold up from orbit through close approach.
skills/threejs-procedural-planets/SKILL.md on GitHub (opens in a new tab) -
threejs-procedural-vegetation
Generate authored procedural trees, grass, ivy, flowers, and vegetation in Three.js or raw WebGPU. Use for surface-following vines, painted ivy paths, stylized or GPU grass, GPU-culled virtual flower fields, trunks, recursive branches, roots, canopies, leaf cards, species presets, deterministic growth, distance-tiered plant geometry, and rooted blade, stem, or petiole-hinge wind.
skills/threejs-procedural-vegetation/SKILL.md on GitHub (opens in a new tab) -
threejs-procedural-vfx
Author production real-time VFX in Three.js. Use for filmic HDR lens-flare compositors, highlight-derived ghosts, field-angle pupil deformation, localized glare and bloom, raymarched aurora curtains, finite-footprint emissive slabs, uniform volume integration, equirectangular radiance probes, WebGPU voxel fire and smoke, coupled volumetric fluid fields, mesh-surface emitters, signed-distance fire…
skills/threejs-procedural-vfx/SKILL.md on GitHub (opens in a new tab) -
threejs-raymarched-space-effects
Build raymarched space phenomena in Three.js. Use for black-hole lensing, accretion disks, wormhole throat transits, curved-ray and null-geodesic integration, lensed celestial spheres, procedural star fields and galactic skies, relativistic-looking distortion, bounded volumetric structures, and GPU effects that need controlled numerical integration.
skills/threejs-raymarched-space-effects/SKILL.md on GitHub (opens in a new tab) -
threejs-screen-space-ambient-occlusion
Implement a production GTAO path in Three.js. Use for half-resolution horizon sampling, reversed-depth reconstruction, bent-normal encoding, full-resolution bilateral reconstruction, environment-light application, contact grounding, and halo diagnosis.
skills/threejs-screen-space-ambient-occlusion/SKILL.md on GitHub (opens in a new tab) -
threejs-shadow-systems
Implement stable, scalable directional-shadow systems for Three.js. Use for large procedural worlds, city scenes, terrain, moving cameras, WebGPU/TSL shadow nodes, cascades, cached clipmaps, texel stabilization, update budgets, and targeted invalidation.
skills/threejs-shadow-systems/SKILL.md on GitHub (opens in a new tab) -
threejs-skill-router
Route ambitious Three.js graphics work to the smallest expert skill set. Use for new visual experiences, graphics rewrites, reference matching, or requests spanning geometry, materials, atmosphere, shadows, temporal effects, and final image treatment.
skills/threejs-skill-router/SKILL.md on GitHub (opens in a new tab) -
threejs-spectral-ocean
Build large procedural oceans and coast transitions in Three.js. Use for WebGPU/TSL FFT oceans, multi-cascade wavelength bands, coastal breakers, finite-volume shallow-water beach waves, signed-distance coastlines, shallow-water swash films, wet-sand transitions, rock-impact spray, stylized above/below surface optics, permanently submerged Snell-window views, total internal reflection, forward-re…
skills/threejs-spectral-ocean/SKILL.md on GitHub (opens in a new tab) -
threejs-temporal-surfaces
Build view-aligned and screen-space surface effects in Three.js. Use for touch-history frost and thaw, ping-pong accumulation, reduced-resolution blur, crystalline masks, two-scale refraction, and procedural rain droplets that refract and blur a background through wet glass.
skills/threejs-temporal-surfaces/SKILL.md on GitHub (opens in a new tab) -
threejs-visual-validation
Validate advanced Three.js graphics as authored systems rather than subjective screenshots. Use for fixed-view visual contracts, field and pass diagnostics, no-post baselines, seed sweeps, camera-scale tests, temporal stability checks, GPU budgets, and regression evidence for procedural scenes.
skills/threejs-visual-validation/SKILL.md on GitHub (opens in a new tab) -
threejs-volumetric-clouds
Implement volumetric cloud systems in Three.js. Use for weather-driven density, bounded raymarching, shape/detail erosion, vertical profiles, lighting cones, silver lining, temporal reconstruction, cloud shadows, multiple layers, and scalable quality modes.
skills/threejs-volumetric-clouds/SKILL.md on GitHub (opens in a new tab) -
threejs-water-optics
Build production analytic and bounded water in Three.js. Use for shared multi-wave displacement and normals, bounded RGBA heightfield pool simulation, local drops, object-driven ripples, differential-area caustics, ray-traced pool/water/sphere volume optics, derivative-filtered normal bands, analytic sky reflection, side-aware Fresnel, heuristic screen refraction, Beer-Lambert absorption, and cre…
skills/threejs-water-optics/SKILL.md on GitHub (opens in a new tab)
No skill matches that filter.
Review before you install
A skill is a set of instructions and scripts your agent will follow, and it can run code on your machine. Read the SKILL.md and any scripts first — this listing is not a security review.