How do I install the Threejs Image Pipeline skill?

Run npx skillmds@latest add gabrielmoreira/threejs-image-pipeline in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Threejs Image Pipeline safe to use?

This skill has not completed SkillMD's automated safety review yet. Capability flags: docs only. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Threejs Image Pipeline?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Threejs Image Pipeline free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Threejs Image Pipeline?

gabrielmoreira (@gabrielmoreira) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Threejs Image Pipeline by gabrielmoreira

Name: Threejs Image Pipeline
Rating: 4.2 (5 reviews)
Author: gabrielmoreira

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.

gabrielmoreira Updated Sep 9, 2026 17 repo stars

File contents

Image Pipeline

Use this skill only when composing several image-space systems or defining shared buffers. For one effect, load its atomic skill instead.

Load:

$threejs-screen-space-ambient-occlusion for GTAO, bent normals, denoising, or AO application;
$threejs-bloom for HDR extraction and bloom;
$threejs-exposure-color-grading for metering, adaptation, tone mapping, LUTs, and output conversion.

The pipeline must expose its signals and ordering. Do not install a pile of effects and tune the final frame blindly.

Signal order

scene HDR color + depth + normals + albedo where required
  → lighting-related screen effects
  → atmosphere/transparency composition
  → bloom
  → exposure
  → tone mapping
  → grading
  → lens/presentation effects
  → output conversion

Read references/production-image-pipeline.md for four production pass graphs, their buffer/resolution contracts, and the ownership boundaries between whole-scene and effect-local graphs.

Rules

Tone-map once.
Keep HDR bloom before tone mapping.
Meter exposure from a small luminance target, not the final 8-bit screen.
Separate direct and indirect light before applying bent-normal ambient tint when possible.
Upsample low-resolution effects with depth/normal-aware weights.
Build pass toggles and effect-only views before tuning.
UI rendered in the same target needs an explicit protection strategy.
Do not load all atomic post skills by default. Route only the effects actually requested.

Routing boundary

Use this skill when multiple image-space systems must share buffers, ordering, or output ownership. For one isolated effect, use its atomic skill without loading this coordinator.

---name: threejs-image-pipelinedescription: 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.--- # Image Pipeline Use this skill only when composing several image-space systems or defining shared buffers. For one effect, load its atomic skill instead. Load: - `$threejs-screen-space-ambient-occlusion` for GTAO, bent normals, denoising, or AO application; - `$threejs-bloom` for HDR extraction and bloom; - `$threejs-exposure-color-grading` for metering, adaptation, tone mapping, LUTs, and output conversion. The pipeline must expose its signals and ordering. Do not install a pile of effects and tune the final frame blindly. ## Signal order ```text scene HDR color + depth + normals + albedo where required → lighting-related screen effects → atmosphere/transparency composition → bloom → exposure → tone mapping → grading → lens/presentation effects → output conversion ``` Read [references/production-image-pipeline.md](references/production-image-pipeline.md) for four production pass graphs, their buffer/resolution contracts, and the ownership boundaries between whole-scene and effect-local graphs. ## Rules - Tone-map once. - Keep HDR bloom before tone mapping. - Meter exposure from a small luminance target, not the final 8-bit screen. - Separate direct and indirect light before applying bent-normal ambient tint when possible. - Upsample low-resolution effects with depth/normal-aware weights. - Build pass toggles and effect-only views before tuning. - UI rendered in the same target needs an explicit protection strategy. - Do not load all atomic post skills by default. Route only the effects actually requested. ## Routing boundary Use this skill when multiple image-space systems must share buffers, ordering, or output ownership. For one isolated effect, use its atomic skill without loading this coordinator.

Frequently asked questions