Effects reference

import { Blur, Curves, FilmGrain } from "framefields";
// same classes: import { … } from "framefields/effects";
// factory form: Effect.blur({ strength: 9 })

Attach with layer.withEffect(fx), layer.withEffects([...]), comp.apply(fx), comp.section({ effects }) or Media.apply(fx) — see Effects. Every prop is an EffectProp<T>: a plain value, a signal, or a function hook. Out-of-range values warn; FRAMEFIELDS_STRICT_PROPS=1 makes them throw. Types, ranges and defaults for every prop are in the generated effect catalog.

Scales

Many strengths are 0–100: Vignette.strength (default 50), FilmGrain.strength (15), Blur.strength (5). ColorBalance shifts are −100…100. Normalized positions and region radii (centerX, centerY, radius) are 0–1.

Grading

Effect	Props
Curves	curveType, master, red, green, blue, hueVsHue, hueVsSat, lumVsSat, satVsSat
Levels	master, red, green, blue
ColorBalance	shadows, midtones, highlights, preserveLuminosity
SelectiveColor	method, reds, yellows, greens, cyans, blues, magentas, whites, neutrals, blacks
GradientMap	stops, smooth, dither, opacity
ShadowsHighlights	shadowAmount, shadowTonalWidth, shadowRadius, highlightAmount, highlightTonalWidth, highlightRadius, colorCorrection, midtoneContrast
ApplyLUT	lutUrl, intensity
ExtractLUT	strategy, samplePoints
Modulate	hue, brightness, contrast, exposure, saturation, sepia
ChannelSplitter	colorSpace
ChannelMerger	colorSpace, defaultChannel4

Texture & lens

Effect	Props
FilmGrain	strength, size, monochrome, animated, speed, shadows, midtones, highlights
Vignette	strength, radius, softness, roundness, centerX, centerY
Blur	blurType, strength, angle, sigmaColor, centerX, centerY, partialBlur, radius, radiusY, shape, track
MotionBlur	shutterAngle, samples, maxVelocity, shutterCurve, depthAware
UnsharpMask	amount, radius, threshold
HighPass	radius, contrastBoost, monochrome
HalftoneScreen	mode, dotShape, frequency, angle, contrast, dotColor, paperColor, smooth, invert, cyanAngle, magentaAngle, yellowAngle, blackAngle, opacity
TileOffset	offsetX, offsetY, wrap, edgeMode
TemporalDeflicker	blendWeight, disocclusionThreshold, maxMotionPixels, scale, windowSize

Distortion & framing

Effect	Props
DisplacementMap	strengthX, strengthY, xChannel, yChannel, wrapMode
Liquify	operations
MeshWarp	cols, rows, points
CornerPin	points
Rotate	angle, fit, scale
Flip	horizontal, vertical, diagonal, mode, symmetry
KenBurns	keyframes, motionBlurSize, movementStyle, aspectRatio
ResizerScaler	aspectRatioPreset, resolutionPreset, targetWidth, targetHeight, fitMode, zoom, offsetX, offsetY, backgroundMode, backgroundColor, backgroundColor2, blurRadius, backgroundBrightness, anchorX, anchorY
Crop	cropType, leftPercentage, topPercentage, widthPercentage, heightPercentage, roundness, pathPoints, mode

3D & light

Effect	Props
Relight3D	lightType, intensity, lightPosX, lightPosY, lightPosZ, lightRadius, spotConeAngle, specularRoughness, specularStrength, metallic, ambientIntensity, volumetricDensity, depthScale, depthInvert, lightColor, ambientColor, normalMap
SSAO	radius, bias, intensity, kernelSamples, blurRadius
PBRGlass	ior, roughness, transmission, dispersion, fresnelPower, tintColor
DepthOfField	focusDistance, focalLength, aperture, maxBlur, quality
RefractionCaustics3D	ior, dispersion, refractionScale, causticBrightness, causticScale, fluidRipples, rippleSpeed, roughness, specularIntensity, lightPosX, lightPosY, tintColor, tintStrength, depthInvert, depthScale
CameraParallax3D	motionPreset, panX, panY, dollyZ, fov, parallaxAmount, dofAperture, focusPlane, edgeDilation, depthInvert

Mattes & keying

Effect	Props
ColorKey	keyColor, similarity, smoothness, spillSuppression, colorSpace, spillSuppressionType
RefineEdge	decontaminateAmount, radius, smooth, feather, shiftEdge, matteChannel, outputMode
MaskMath	operation, radius, threshold, clampMin, clampMax, channelA, channelB, binarize, invertResult, outputFormat
PatchHeal	patches, centerX, centerY, offsetX, offsetY, radius, sourceRadius, feather, opacity, mode

Generators & style

Effect	Props
NoiseGenerator	noiseType, outputType, width, height, scale, octaves, persistence, lacunarity, speed, colorStart, colorEnd, durationMs, fps
ProceduralVFX	effectType, outputType, width, height, density, scale, speed, intensity, seed, colorStart, colorEnd, durationMs, fps
Paint	width, height, maintainAspect, aspectRatio, backgroundColor, strokes
LayerStyle	dropShadow, innerShadow, outerGlow, innerGlow, stroke, bevelEmboss, colorOverlay

Audio

Effect	Props
AudioFade	fadeInDuration, fadeOutDuration, fadeInCurve, fadeOutCurve
AudioCompressor	threshold, ratio, attack, release, knee, makeupGain
AudioParametricEq	type, frequency, gain, q
AudioReverb	roomSize, damping, wet, dry, width
AudioDelay	delayTime, feedback, wet, dry, pingPong
AudioNoiseGate	threshold, attack, hold, release, range
StereoPanning	pan
AudioSignalExtractor	extractionMode, attackMs, releaseMs, sensitivity, noiseFloorDb, dynamicRangeDb, autoRange, smoothing, curve, beatThreshold, beatDecayMs, previewMode, nodeId

Vision

Effect	Props
Vision	enableDetection, enableSegmentation, enablePose, enableMatte, classes, confidence, variant, mode, matteSource, maxMissedFrames, modelsDir, baseUrl, maskThreshold, featherRadius, keyBackground, backgroundKeyThreshold, visionBundle

Recipes

// Warm filmic grade for a whole film
comp.apply(new ColorBalance({ shadows: { cyanRed: 4, yellowBlue: -6 }, highlights: { cyanRed: 2, yellowBlue: -4 } }));
comp.apply(new Vignette({ strength: 30, radius: 0.9, softness: 0.65 }));
comp.apply(new FilmGrain({ strength: 12, size: 1.5, animated: true }));

// Greenscreen key
Layer.video("assets/footage/green.mp4").withEffect(new ColorKey({ keyColor: "#00ff00", similarity: 0.4, smoothness: 0.1, spillSuppression: 0.3 }));

// Print look
layer.withEffect(new HalftoneScreen({ mode: "CMYK", dotShape: "Circle", frequency: 30 }));

// Duotone
layer.withEffect(new GradientMap({ stops: [{ position: 0, color: "#0e0d0c" }, { position: 1, color: "#ff5a1f" }] }));

// Audio clean-up
Layer.audio("assets/audio/vo.wav", { durationFrames }).apply(new AudioNoiseGate({ threshold: -45 })).apply(new AudioCompressor({ threshold: -18, ratio: 3 }));