docs: correct the --hf-color-grading-intensity claim

Both pages said intensity does not scale a grade and that 0.5 renders the
same as 0. That is wrong, and the error was mine: I tested intensity only
against twoInkPrint and tapeDamage, then generalised from an effects-only
result.

The shader mixes ungraded against graded at u_intensity
(runtime/colorGrading.ts:1234), so it does scale adjust, wheels, curves,
hueCurves, secondaries and the LUT. Runtime tests pin 0.25 and 0.75
reaching the uniform. What it does not scale is details and effects —
grain, filmArtifacts, monoScreen, engraving, crosshatch, halftone,
twoInkPrint and the tape/CRT families are all applied after that mix
(:1235-1262), which is exactly what I had measured.

Both pages now say intensity ramps the primary grade only, and to animate
the specific effect when the look is effect-based.

Reported by miguel-heygen.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
Vance Ingalls
2026-07-31 19:49:55 -07:00
co-authored by Claude Opus 5
parent e4eac0c215
commit dd9c86d07a
2 changed files with 8 additions and 4 deletions
+7 -3
View File
@@ -268,9 +268,13 @@ just the endpoints.
Two things this list does **not** give you:
- **`--hf-color-grading-intensity` does not scale a grade at render time.**
Setting it to `0.5` renders the same as `0`, and animating `0 → 1` produces no
change. Do not reach for it as a generic "ramp the whole look" dial.
- **`--hf-color-grading-intensity` scales the primary grade only.** The shader
mixes between the ungraded sample and the graded one at that value, so it
ramps `adjust`, `wheels`, `curves`, `hueCurves`, `secondaries` and the LUT.
It does **not** touch `details` or `effects` — grain, vignette, halftone,
twoInkPrint, bloom, the tape and CRT families are all applied *after* that
mix. So it is not a master "ramp the whole look" dial when the look is
effect-based; animate the specific effect instead.
- **Every other property — `halftone`, `twoInkPrint`, `tapeDamage`, hue curves,
secondaries — has no custom property**, so it cannot be tweened this way.
+1 -1
View File
@@ -159,7 +159,7 @@ Nine properties expose a CSS custom property and tween directly — `ascii`, `bl
Two caveats worth knowing before you promise a client a ramp:
- **`--hf-color-grading-intensity` does not scale a grade at render time.** A static `0.5` renders the same as `0`. Do not reach for it as a generic "ramp the whole look" dial.
- **`--hf-color-grading-intensity` scales the primary grade only** — `adjust`, `wheels`, `curves`, `hueCurves`, `secondaries` and the LUT. It does *not* scale `details` or `effects`, which are applied after that mix, so it will not ramp grain, halftone, bloom or the tape and CRT families. Reach for the specific effect instead of treating it as a master dial.
- **Everything else has no custom property.** Some of those can still be animated by rewriting the `data-color-grading` payload from the timeline, and some cannot — the verified list of which is which lives in the guide's [Animating a Grade](/guides/color-grading#animating-a-grade), so it only has to be maintained in one place. Measure the effect you intend to animate before you promise a ramp, and fall back to a static treatment if it does not move.
## Next steps