Overview API Reference Compile Docs Effects Examples Math Download

Effects Reference

Auto-generated descriptions for all pixel operations available in the JavaScript engine.

Table of Contents / Inhaltsverzeichnis

Color & Tone / Farbe & Ton

brightness

Multiplies the luminance of every pixel by a factor. Values > 1 brighten the image, values < 1 darken it. Alpha channel is preserved.

Parameter Type Default Description / Beschreibung
factor number — Multiplier · Multiplikator (0.5 = halb so hell, 2.0 = doppelt so hell)
rect Rect? full Normalized [x,y,w,h] region to apply to · Bereich in dem der Effekt angewendet wird

JS: img.brightness(1.1) or img.brightness(1.1, img.rectFromPixels(0,0,200,200))

contrast

Enhances local contrast by expanding the luminance range away from the midpoint (0.5). Values > 1 increase contrast; values close to 0 flatten the image toward grey.

Parameter Type Default Description / Beschreibung
factor number — Contrast strength · Kontraststärke (1.0 = unverändert)
rect Rect? full Normalized region · Normierter Bereich

JS: img.contrast(1.15)

saturation

Scales color saturation. 0 desaturates to grey, 1 leaves unchanged, values > 1 produce vivid/over-saturated colours. Luminance is preserved.

Parameter Type Default Description / Beschreibung
factor number — Saturation multiplier · Sättigungsfaktor
rect Rect? full Normalized region · Normierter Bereich

JS: img.saturation(1.2)

hue

Rotates all pixel hues on the HSL colour wheel by a given angle in degrees. 180° produces a complementary-colour shift; 360° is a full rotation back to the original.

Parameter Type Default Description / Beschreibung
delta number — Rotation in degrees · Drehwinkel in Grad (−360 … +360)
rect Rect? full Normalized region · Normierter Bereich

JS: img.hue(30)

invert

Inverts all colour channels: each value v becomes 1 − v. Produces a photographic negative effect. Alpha is preserved.

Parameter Type Default Description / Beschreibung
rect Rect? full Normalized region · Normierter Bereich

JS: img.invert()

grayscale

Converts the image to greyscale using luminance-weighted averaging (perceptual weights: R 0.299, G 0.587, B 0.114). Colour channels are all set to the same luminance value; alpha is preserved.

Parameter Type Default Description / Beschreibung
rect Rect? full Normalized region · Normierter Bereich

JS: img.grayscale()

sepia

Applies a classic sepia tone by first desaturating then applying warm brownish toning, mimicking aged photographic prints.

Parameter Type Default Description / Beschreibung
rect Rect? full Normalized region · Normierter Bereich

JS: img.sepia()

threshold

Converts the image to black-and-white by comparing each pixel's luminance to a threshold: pixels above become white, below become black. See thresholding (image processing).

Parameter Type Default Description / Beschreibung
value number 0.5 Threshold ∈ [0..1] · Schwellwert
rect Rect? full Normalized region · Normierter Bereich

JS: img.threshold(0.5)

tint

Blends the image toward a solid colour. At strength=0 the original is unchanged; at strength=1 the image is replaced by the solid tint colour.

Parameter Type Default Description / Beschreibung
color Pixel|string — Target tint colour (Pixel or "#rrggbb") · Zielfarbe
strength number — Blend factor ∈ [0..1] · Überblendungsanteil
rect Rect? full Normalized region · Normierter Bereich

JS: img.tint(new Pixel(0.1, 0.2, 0.8), 0.5) or img.tint("#1a33cc", 0.5)

adjustAlpha

Modifies the alpha (transparency) channel of every pixel. Useful for making images semi-transparent before compositing.

Parameter Type Default Description / Beschreibung
value number — Target/multiplier/delta value · Ziel-/Multiplikator-/Deltawert ∈ [0..1]
mode AlphaMode Set AlphaMode.Set = set directly · direkt setzen; Mul = multiply · multiplizieren; Add = add · addieren
rect Rect? full Normalized region · Normierter Bereich

JS: img.adjustAlpha(0.7, AlphaMode.Set) — sets all pixels to 70% opacity

colorJitter / colorJiggle

Randomly perturbs brightness, contrast, saturation, and hue of each pixel within the given ranges. Non-deterministic — result differs every run. Useful for data augmentation.

Parameter Type Default Description / Beschreibung
brightness number 0 Max brightness jitter · Max. Helligkeitsabweichung
contrast number 0 Max contrast jitter · Max. Kontrastabweichung
saturation number 0 Max saturation jitter · Max. Sättigungsabweichung
hue number 0 Max hue jitter in degrees · Max. Farbtonabweichung in Grad

JS: img.colorJitter(0.1, 0.1, 0.2, 10)

shadowsHighlights

Recovers detail in dark (shadow) and bright (highlight) areas independently. Positive shadows lifts blacks; negative highlights pulls down blown-out whites without affecting midtones much.

Parameter Type Default Description / Beschreibung
shadows number 0 Shadow lift ∈ [0..1] · Schattenanhebung (0 = keine Wirkung)
highlights number 0 Highlight recovery ∈ [−1..0] · Lichterwiederherstellung (0 = keine Wirkung)

JS: img.shadowsHighlights({ shadows: 0.35, highlights: -0.25 }) Directive: //!PARAM: SHADOWS:number=0.35, HIGHLIGHTS:number=-0.25

Filters / Filter

gaussianBlur / blur

Smooths the image using a Gaussian kernel. Higher sigma = wider blur radius. Reduces noise and fine detail; often used before edge detection.

Parameter Type Default Description / Beschreibung
sigma number — Standard deviation in pixels · Standardabweichung in Pixeln

JS: img.gaussianBlur(2.0)

boxBlur

Uniform box blur — averages all pixels within a square neighbourhood. Faster than Gaussian blur; produces a slightly harder edge on the blur zone.

Parameter Type Default Description / Beschreibung
size number — Half-width of kernel in pixels · Halbe Kernbreite in Pixeln

JS: img.boxBlur(5)

sharpen

Enhances fine detail using unsharp masking: subtracts a blurred version from the original and adds back the difference, amplified by amount.

Parameter Type Default Description / Beschreibung
amount number 1.0 Sharpening strength · Schärfungsstärke (typical: 0.5 – 2.0)

JS: img.sharpen(1.5)

bilateralBlur

Bilateral filter — smooths textures while preserving sharp edges. Unlike Gaussian blur, pixels are weighted by both spatial proximity and colour similarity.

Parameter Type Default Description / Beschreibung
d number 9 Diameter of pixel neighbourhood · Durchmesser des Pixelumfelds
sigmaColor number 75 Color similarity range · Farbähnlichkeitsbereich (größer = mehr Glättung über Farbgrenzen)
sigmaSpace number 75 Spatial range · Räumlicher Bereich

JS: img.bilateralBlur(9, 75, 75)

sobel

Sobel operator — detects edges by computing the image gradient magnitude in X and Y. Output is a greyscale edge map.

No parameters / Keine Parameter

JS: img.sobel()

canny

Canny edge detector — a multi-stage algorithm that produces clean, thin edges by applying Gaussian smoothing, gradient computation, non-maximum suppression, and hysteresis thresholding.

Parameter Type Default Description / Beschreibung
low number 0.1 Lower hysteresis threshold ∈ [0..1] · Unterer Hysterese-Schwellwert
high number 0.3 Upper hysteresis threshold ∈ [0..1] · Oberer Hysterese-Schwellwert

JS: img.canny(0.1, 0.3)

dither

Floyd–Steinberg dithering — quantizes the image to black/white while distributing the quantization error to neighbouring pixels, producing a halftone-like pattern that appears smoother to the eye than hard thresholding.

No parameters / Keine Parameter

JS: img.dither()

dilate

Morphological dilation — expands bright regions by replacing each pixel with the maximum value in its neighbourhood. Thickens bright lines and fills small dark holes.

Parameter Type Default Description / Beschreibung
size number 1 Radius of structuring element · Radius des Strukturelements in Pixeln

JS: img.dilate(2)

erode

Morphological erosion — shrinks bright regions by replacing each pixel with the minimum value in its neighbourhood. Thins bright lines and enlarges dark holes.

Parameter Type Default Description / Beschreibung
size number 1 Radius of structuring element · Radius des Strukturelements in Pixeln

JS: img.erode(2)

filmGrain

Adds random luminance noise to simulate the look of photographic film grain. Non-deterministic — result differs every run.

Parameter Type Default Description / Beschreibung
amount number 0.05 Grain intensity ∈ [0..1] · Körnung-Intensität

JS: img.filmGrain(0.08)

pixelate

Pixelation (mosaic) effect — divides the image into square blocks and fills each with the average colour of that block. Larger size = coarser mosaic.

Parameter Type Default Description / Beschreibung
size number — Block size in pixels · Blockgröße in Pixeln

JS: img.pixelate(16)

posterize

Posterization — reduces the number of distinct colour values per channel to levels, producing a flat, graphic-poster-like appearance.

Parameter Type Default Description / Beschreibung
levels number 4 Colour levels per channel · Farbstufen pro Kanal (2 = extreme, 8 = subtle)

JS: img.posterize(4)

oilPaint

Oil painting effect — replaces each pixel with the most frequent (dominant) colour in its neighbourhood, creating brushstroke-like patches. Higher radius = broader strokes.

Parameter Type Default Description / Beschreibung
radius number 4 Brush radius in pixels · Pinselradius in Pixeln
levels number 8 Intensity quantization buckets · Intensitäts-Quantisierungsstufen

JS: img.oilPaint(4, 8)

solarize

Solarization — inverts pixels whose luminance exceeds the threshold, creating a surreal partial-negative effect famously associated with Man Ray's darkroom technique.

Parameter Type Default Description / Beschreibung
threshold number 0.5 Luminance threshold ∈ [0..1] · Luminanz-Schwellwert

JS: img.solarize(0.5)

Geometry / Geometrie

resize

Scales the image to the specified dimensions. Width or height can be 0 to preserve the aspect ratio. Interpolation method controls quality vs. speed.

Parameter Type Default Description / Beschreibung
w number — Target width (0 = auto) · Zielbreite (0 = automatisch)
h number — Target height (0 = auto) · Zielhöhe (0 = automatisch)
interp Interp Bilinear Interp.Nearest / Bilinear / Bicubic

JS: img.resize(1280, 0, Interp.Bicubic)

crop

Cuts out a rectangular region and discards the rest. The output image has dimensions w × h.

Parameter Type Default Description / Beschreibung
x number — Left edge in pixels · Linke Kante in Pixeln
y number — Top edge in pixels · Obere Kante in Pixeln
w number — Width of crop region · Breite des Ausschnittbereichs
h number — Height of crop region · Höhe des Ausschnittbereichs

JS: img.crop(100, 50, 800, 600)

rotate

Rotates the image in-place (canvas size unchanged). Pixels that rotate outside the frame are clipped; empty areas are filled with transparent black.

Parameter Type Default Description / Beschreibung
angle number — Rotation angle in degrees · Drehwinkel in Grad (clockwise positive · im Uhrzeigersinn positiv)

JS: img.rotate(45)

rotateExpand

Like rotate, but expands the canvas to fit the rotated content. No pixels are clipped; the bounding box of the rotated image becomes the new size.

Parameter Type Default Description / Beschreibung
angle number — Rotation angle in degrees · Drehwinkel in Grad

JS: img.rotateExpand(30)

flipH / flipV

Mirrors the image horizontally (flipH, left↔right) or vertically (flipV, top↔bottom). No quality loss — a pixel-exact operation.

No parameters / Keine Parameter

JS: img.flipH() / img.flipV()

pad

Adds a border of the given thickness around the image. The fill can be a solid colour (Pixel or hex string) or a mirror/wrap/replicate mode from BorderMode.

Parameter Type Default Description / Beschreibung
top number — Top padding in pixels · Oberer Rand in Pixeln
bottom number — Bottom padding · Unterer Rand
left number — Left padding · Linker Rand
right number — Right padding · Rechter Rand
color Color|BorderMode transparent Fill colour or border mode · Füllfarbe oder Randmodus

JS: img.pad(20, 20, 20, 20, "#000000") or img.padTop(40, BorderMode.Reflect)

warp4

Perspective warp using four control points. Maps a quadrilateral region in the source image to a rectangle (or any quad) in the output. Commonly used to correct perspective distortion in scanned documents or photos taken at an angle.

Parameter Type Default Description / Beschreibung
p0 p1 p2 p3 x,y pairs — Four corner points in source (TL, TR, BR, BL) · Vier Eckpunkte im Quellbild

JS: via img.warpPerspective() with a computed homography matrix

warpPerspective

Low-level homographic warp using a 3×3 matrix. The matrix maps source → destination pixel coordinates. Use warp4 or stampAt for a higher-level interface.

Parameter Type Default Description / Beschreibung
dw number — Output width · Ausgabebreite
dh number — Output height · Ausgabehöhe
matrix number[9] — 3×3 row-major homography (src→dst) · Zeilenbezogene Homographie-Matrix
interp Interp Bilinear Interpolation method · Interpolationsmethode

JS: img.warpPerspective(800, 600, myMatrix, Interp.Bicubic)

warpPolar

Polar transform — maps the image from Cartesian to polar coordinates, creating a ring/donut shape. Useful for creating circular panoramas or extracting radial symmetry.

Parameter Type Default Description / Beschreibung
innerR number 0.3 Inner radius fraction ∈ [0..1] · Innerer Radiusanteil
outSize number 0 Output size (0 = auto) · Ausgabegröße (0 = automatisch)

JS: img.warpPolar(0.2, 512)

fisheye

Fisheye lens distortion — barrel-distorts the image within a circular region, pushing pixels toward the edge of the lens circle. The effect is strongest at the center of the radius.

Parameter Type Default Description / Beschreibung
cx, cy Px center Center of distortion (pixel coords) · Verzerrungsmittelpunkt (Pixelkoordinaten)
r number — Radius in pixels · Radius in Pixeln
amount number — Distortion strength (negative = pincushion) · Verzerrungsstärke (negativ = Kissenverzeichnung)

JS: img.fisheye(px(img.width/2, img.height/2), 200, 0.8)

swirl

Swirl/twirl distortion — rotates pixels within a circular region by an angle that decreases from the center outward, creating a swirling vortex pattern.

Parameter Type Default Description / Beschreibung
cx, cy Px center Center of swirl · Wirbelmittelpunkt
r number — Radius in pixels · Radius in Pixeln
angle number — Max rotation at center (degrees) · Max. Drehwinkel im Zentrum (Grad)

JS: img.swirl(px(img.width/2, img.height/2), 300, 90)

wave

Sinusoidal wave distortion — offsets each pixel's position using sine functions in X and/or Y, creating a rippling or undulating effect.

Parameter Type Default Description / Beschreibung
amplitudeX number 0 X displacement amplitude in pixels · X-Verschiebungsamplitude in Pixeln
amplitudeY number 0 Y displacement amplitude · Y-Verschiebungsamplitude
freqX number 0 X frequency in cycles/width · X-Frequenz in Zyklen/Breite
freqY number 0 Y frequency in cycles/height · Y-Frequenz in Zyklen/Höhe

JS: img.wave(10, 5, 0.03, 0.02)

kaleidoscope

Kaleidoscope effect — mirrors a pie-slice of the image around a center point and repeats it segments times, producing radially-symmetric patterns.

Parameter Type Default Description / Beschreibung
cx, cy Px center Center point · Mittelpunkt
segments number 6 Number of mirror segments · Anzahl Spiegelsegmente
rotation number 0 Slice start angle (degrees) · Startwinkel des Segments (Grad)

JS: img.kaleidoscope(px(img.width/2, img.height/2), 8, 0)

mirror

Reflects the image across an arbitrary line defined by two points (in normalized [0..1] coordinates). Everything on one side of the line is replaced by the reflection of the other side.

Parameter Type Default Description / Beschreibung
x1, y1 number — First line point (normalized) · Erster Linienpunkt (normiert)
x2, y2 number — Second line point (normalized) · Zweiter Linienpunkt (normiert)

Composition / Komposition

blend

Blends two images of equal size together according to a factor and an optional blend mode. factor=0 = original unchanged; factor=1 = replaced by other. Various blend modes (Screen, Multiply, Overlay, …) follow standard Photoshop-layer semantics.

Parameter Type Default Description / Beschreibung
other ImageHandle — Second image to blend with · Zweites Bild
factor number — Blend factor ∈ [0..1] · Überblendungsfaktor
mode BlendMode Normal Blend.Normal, Screen, Multiply, Overlay, Over, …

JS: img.blend(overlay, 0.5, Blend.Screen)

blendAt

Composites other onto this at a given pixel offset (x, y). Use Blend.Over (Porter-Duff) for alpha-aware compositing of cut-outs. other may extend beyond the canvas edges; only the overlapping region is composited.

Parameter Type Default Description / Beschreibung
other ImageHandle — Image to composite · Zu kompositierendes Bild
pos Px — Top-left pixel coordinate on base image · Pixel-Position oben links im Basisbild
factor number 1.0 Opacity ∈ [0..1] · Deckkraft
mode BlendMode Over Blend mode · Blend-Modus

JS: base.blendAt(overlay, px(80, 100), 0.9, Blend.Over)

stampAt

Perspective-stamps other onto this by computing the homography that maps the four corners of other to the four destination points. Handles arbitrary quadrilateral targets (not just axis-aligned rectangles).

Parameter Type Default Description / Beschreibung
other ImageHandle — Image to stamp · Zu stempelndes Bild
pts Px[4] — Destination corners TL, TR, BR, BL · Ziel-Eckpunkte oben-links, oben-rechts, unten-rechts, unten-links

JS: canvas.stampAt(face, [px(x0,y0), px(x1,y1), px(x2,y2), px(x3,y3)])

applyMask

Applies a greyscale mask image to the alpha channel. Bright mask pixels → opaque; dark pixels → transparent. Allows non-rectangular cutouts and feathered edges.

Parameter Type Default Description / Beschreibung
mask ImageHandle — Greyscale mask image · Graustufen-Maskenbild

JS: img.applyMask(maskImage)

montageH / montageV

Stitches images side-by-side horizontally (montageH) or top-to-bottom vertically (montageV). All images are expected to share the same perpendicular dimension (same height for montageH, same width for montageV).

Parameter Type Default Description / Beschreibung
...others ImageHandle[] — Images to stitch · Zu fügende Bilder

JS: const strip = img1.montageH(img2, img3, img4)

Effects & Styles / Effekte & Stile

vignette

Darkens the edges of the image progressively toward the corners, drawing attention to the center. The effect is based on a radial gradient that goes from full brightness at the center to darkened at the perimeter.

Parameter Type Default Description / Beschreibung
strength number — Effect intensity ∈ [0..1] · Effektstärke (0 = kein Effekt, 1 = starke Randabdunklung)
rect Rect? full Normalized region · Normierter Bereich

JS: img.vignette(0.4)

glow

Adds a soft luminous halo around bright regions by blending a blurred, colour-tinted copy of the image back onto itself using Screen blend mode.

Parameter Type Default Description / Beschreibung
blur number 15 Glow radius (Gaussian sigma) · Glühradius (Gauss-Sigma)
color Color white Tint colour for the glow · Farbe des Glühlichts

JS: img.glow(15, "#ffffff")

dropShadow

Adds a drop shadow by creating a blurred, offset, coloured copy of the image's silhouette behind the original.

Parameter Type Default Description / Beschreibung
dx number 5 Horizontal shadow offset in pixels · Horizontaler Schattenversatz in Pixeln
dy number 5 Vertical shadow offset · Vertikaler Schattenversatz
blur number 8 Shadow blur radius (Gaussian sigma) · Unschärferadius des Schattens
color Color black Shadow colour · Schattenfarbe

JS: img.dropShadow(5, 5, 8, "#000000")

artisticBold

A preset style that combines Canny edge detection, morphological dilation, and colour inversion to produce a bold ink-drawing / comic-book outline effect.

Parameter Type Default Description / Beschreibung
size number 1 Dilation radius for line thickness · Dilatationsradius für Linienstärke

MLC OpticScript v0.6.1 · © 2026 Michael Lechner · Elastic License 2.0