Practical Blend Modes
summary
Covers concrete techniques: CSS filters and SVG filters for per‑channel color shifts, CSS blend modes (background- and mix-blend-mode) for duotones and text masking, and an SVG-based night mode prototype applied as an IDed filter that toggles via three lines of JS. Shows working demos (a duotone generator, CSS Graham filters library, and a Diffie visual-diff tool) and gives numbers: video compositing at 3.6 MB vs 24.7 MB GIF, reports SVG blend modes beating CSS and canvas in a perf test, and flags backdrop-filter only in Safari while noting the real examples Diffie visual diff tool actually runs.
AI-written summary · about
chapters (10)
- 0:00Start
- 8:01BLEND MODES
- 8:57BLEND MODE MULTIPLY
- 13:59BLEND MODELIGHTEN
- 16:34BLEND MODE COLOR
- 22:24BLEND MODE DIFFERENCE
- 24:18SVG Filter Effects
- 32:40THE NEW YORKER
- 37:30RED CHANNEL
- 37:40BLUE CHANNEL
