Beta — Requires HTML-in-Canvas
The full CRT WebGL effects use Remotion's HTML-in-Canvas API, which is experimental and only available in Chrome Canary. To preview in Remotion Studio:
- Install Chrome Canary (v149+)
- Open
chrome://flags/#canvas-draw-element - Set the flag to Enabled and restart
Rendering via remotion render works without any extra setup. For WebGL shaders, add --gl=angle.
Render CLI
npx remotion render remotion/index.tsx Macintosh output.mp4 --codec=h264 --gl=angle
Composition code
import React, { useCallback, useRef } from 'react';
import {
AbsoluteFill,
HtmlInCanvas,
type HtmlInCanvasOnPaint,
type HtmlInCanvasOnInit,
interpolate,
useCurrentFrame,
useVideoConfig,
useRemotionEnvironment,
} from 'remotion';
Macintosh
Vintage Mac OS 9 desktop simulation with CRT shader effects — barrel distortion, scanlines, VHS roll, film grain, and a full boot sequence animation.
Duration9s
Resolution1920 × 1080
Frame rate30 fps
Frames270
This is a free, open-source template. Copy the code and drop it into your Remotion project.
