gl-transitions 1.74.0 → 1.76.0

package/llms-full.txt

@@ -0,0 +1,1707 @@
+# gl-transitions
+
+> The open collection of GL Transitions: 125 GLSL shaders that turn one image into another as `progress` goes from 0 to 1. Each one is also published as an SkSL runtime effect for Skia. This document describes gl-transitions@1.76.0 (npm).
+
+Every transition is GLSL (WebGL 1 / GLSL ES 1.00) that implements `vec4 transition(vec2 uv)`. The host provides:
+
+- `float progress`: 0.0 shows only the outgoing image, 1.0 only the incoming one
+- `float ratio`: output width / height
+- `vec4 getFromColor(vec2 uv)` and `vec4 getToColor(vec2 uv)`: sample the outgoing and incoming images (uv in [0, 1], origin at the bottom left)
+- one uniform per parameter, set to its default unless the user picks another value
+- one `sampler2D` per extra texture, for the few transitions that list `textures`
+
+SkSL versions (`sksl/<name>.sksl`) are standalone Skia runtime effects: children `_from`, `_to` (then one per extra texture), uniforms `float2 _resolution` (output size in pixels), `progress`, `ratio` and each parameter by name (`bool` parameters are `int` 0 or 1), entry point `half4 main(float2 coord)` with a top-left origin. Draw both images at the output size.
+
+Install: `npm install gl-transitions` (`import transitions from "gl-transitions"`), or fetch the files below. Latest version: https://cdn.jsdelivr.net/npm/gl-transitions@1/
+
+## AdvancedMosaic
+
+Both images break into large blocks that blend, then sharpen into the incoming image
+
+- Tags: pixelate, mosaic, blend
+- Parameters:
+  - `pixelSize` (float = 50)
+- Author: Sergey Kosarevsky
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/AdvancedMosaic.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/AdvancedMosaic.sksl
+- Preview: https://gl-transitions.com/editor/AdvancedMosaic
+
+## BlockDissolve
+
+The incoming image appears in small random blocks
+
+- Tags: dissolve, blocks, noise
+- Parameters:
+  - `blocksize` (float = 0.02)
+- Author: nwoeanhinnogaehr
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/BlockDissolve.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/BlockDissolve.sksl
+- Preview: https://gl-transitions.com/editor/BlockDissolve
+
+## BookFlip
+
+The outgoing image turns like a book page from right to left, revealing the incoming one
+
+- Tags: page, flip, 3d
+- Parameters: none
+- Author: hong
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/BookFlip.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/BookFlip.sksl
+- Preview: https://gl-transitions.com/editor/BookFlip
+
+## Bounce
+
+The outgoing image drops out of the frame with a few bounces, revealing the incoming one
+
+- Tags: bounce, slide, vertical, shadow
+- Parameters:
+  - `shadow_colour` (vec4 = vec4(0, 0, 0, 0.6)) [color]: Color of the shadow cast on the incoming image
+  - `shadow_height` (float = 0.075) [range 0.01 to 0.5]: Height of the shadow, relative to the image height
+  - `bounces` (float = 3) [range 1 to 10 step 1]: Number of bounces before settling
+- Author: Adrian Purser
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Bounce.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Bounce.sksl
+- Preview: https://gl-transitions.com/editor/Bounce
+
+## BowTieHorizontal
+
+Two triangles grow from the left and right edges into a bow tie that reveals the incoming image
+
+- Tags: wipe, shape, horizontal
+- Parameters: none
+- Author: huynx
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/BowTieHorizontal.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/BowTieHorizontal.sksl
+- Preview: https://gl-transitions.com/editor/BowTieHorizontal
+
+## BowTieVertical
+
+Two triangles grow from the top and bottom edges into a bow tie that reveals the incoming image
+
+- Tags: wipe, shape, vertical
+- Parameters: none
+- Author: huynx
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/BowTieVertical.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/BowTieVertical.sksl
+- Preview: https://gl-transitions.com/editor/BowTieVertical
+
+## BowTieWithParameter
+
+A bow-tie wipe with an adjustable shape that can run in reverse
+
+- Tags: wipe, shape
+- Parameters:
+  - `adjust` (float = 0.5)
+  - `reverse` (bool = false): Run the wipe in reverse
+- Author: KMojek
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/BowTieWithParameter.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/BowTieWithParameter.sksl
+- Preview: https://gl-transitions.com/editor/BowTieWithParameter
+
+## Box
+
+The outgoing image shrinks into a box, toward the center or a corner, revealing the incoming one
+
+- Tags: box, zoom, shape
+- Parameters:
+  - `rectIn` (int = 1)
+  - `location` (int = 0) [range 0 to 4 step 1]: Where the box goes: 0 center, 1 left top, 2 left bottom, 3 right top, 4 right bottom
+- Author: lql
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Box.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Box.sksl
+- Preview: https://gl-transitions.com/editor/Box
+
+## ButterflyWaveScrawler
+
+Wavy, color-separated ripples scramble the outgoing image into the incoming one
+
+- Tags: wave, distort, chromatic
+- Parameters:
+  - `amplitude` (float = 1)
+  - `waves` (float = 30)
+  - `colorSeparation` (float = 0.3)
+- Author: mandubian
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/ButterflyWaveScrawler.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/ButterflyWaveScrawler.sksl
+- Preview: https://gl-transitions.com/editor/ButterflyWaveScrawler
+
+## CircleCrop
+
+The outgoing image closes into a circle over a background color, then the incoming one opens from it
+
+- Tags: circle, iris, shape
+- Parameters:
+  - `bgcolor` (vec4 = vec4(0, 0, 0, 1)) [color]: Background color
+- Author: fkuteken
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/CircleCrop.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/CircleCrop.sksl
+- Preview: https://gl-transitions.com/editor/CircleCrop
+
+## ColourDistance
+
+Pixels switch to the incoming image in order of how close their colors are
+
+- Tags: blend, color
+- Parameters:
+  - `power` (float = 5)
+- Author: P-Seebauer
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/ColourDistance.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/ColourDistance.sksl
+- Preview: https://gl-transitions.com/editor/ColourDistance
+
+## CrazyParametricFun
+
+The outgoing image is pulled along a parametric curve into a psychedelic swirl
+
+- Tags: distort, psychedelic
+- Parameters:
+  - `a` (float = 4)
+  - `b` (float = 1)
+  - `amplitude` (float = 120)
+  - `smoothness` (float = 0.1)
+- Author: mandubian
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/CrazyParametricFun.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/CrazyParametricFun.sksl
+- Preview: https://gl-transitions.com/editor/CrazyParametricFun
+
+## CrossZoom
+
+A crossfade through a strong zoom blur
+
+- Tags: zoom, blur, blend
+- Parameters:
+  - `strength` (float = 0.4) [range 0 to 1]: Blur strength
+- Author: rectalogic
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/CrossZoom.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/CrossZoom.sksl
+- Preview: https://gl-transitions.com/editor/CrossZoom
+
+## DefocusBlur
+
+A crossfade through an out-of-focus blur
+
+- Tags: blur, blend
+- Parameters:
+  - `blurSize` (float = 0.02): Amount of blur
+- Author: Sergey Kosarevsky
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/DefocusBlur.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/DefocusBlur.sksl
+- Preview: https://gl-transitions.com/editor/DefocusBlur
+
+## Directional
+
+The incoming image pushes the outgoing one out in a given direction
+
+- Tags: slide, push, directional
+- Parameters:
+  - `direction` (vec2 = vec2(0, 1)): Direction of the movement
+- Author: Gaëtan Renaudeau
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Directional.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Directional.sksl
+- Preview: https://gl-transitions.com/editor/Directional
+
+## DirectionalScaled
+
+Like Directional, with both images scaled down while they slide
+
+- Tags: slide, push, zoom, directional
+- Parameters:
+  - `direction` (vec2 = vec2(0, 1)): Direction of the movement
+  - `scale` (float = 0.7)
+- Author: Thibaut Foussard
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/DirectionalScaled.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/DirectionalScaled.sksl
+- Preview: https://gl-transitions.com/editor/DirectionalScaled
+
+## DoomScreenTransition
+
+The outgoing image melts down in uneven columns, like the Doom screen wipe
+
+- Tags: melt, columns, retro
+- Parameters:
+  - `bars` (int = 30)
+  - `amplitude` (float = 2)
+  - `noise` (float = 0.1)
+  - `frequency` (float = 0.5)
+  - `dripScale` (float = 0.5)
+- Author: Zeh Fernando
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/DoomScreenTransition.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/DoomScreenTransition.sksl
+- Preview: https://gl-transitions.com/editor/DoomScreenTransition
+
+## Dreamy
+
+A crossfade with a gentle wavy distortion
+
+- Tags: wave, blend
+- Parameters: none
+- Author: mikolalysenko
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Dreamy.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Dreamy.sksl
+- Preview: https://gl-transitions.com/editor/Dreamy
+
+## DreamyZoom
+
+Zooms and rotates into a bright flash, then out to the incoming image
+
+- Tags: zoom, rotate, flash
+- Parameters:
+  - `rotation` (float = 6)
+  - `scale` (float = 1.2)
+- Author: Zeh Fernando
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/DreamyZoom.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/DreamyZoom.sksl
+- Preview: https://gl-transitions.com/editor/DreamyZoom
+
+## Drop_Zone_Flicker
+
+A flickering glitch with RGB offset, ghosting and scanlines that flashes back to the outgoing image
+
+- Tags: glitch, flicker, chromatic, scanlines
+- Parameters:
+  - `frameRate` (float = 24)
+  - `rgbOffset` (float = 0.014)
+  - `blockAmount` (float = 0.72)
+  - `ghostAmount` (float = 0.62)
+  - `redCyan` (float = 0.58)
+  - `scanline` (float = 0.075)
+- Author: bread
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Drop_Zone_Flicker.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Drop_Zone_Flicker.sksl
+- Preview: https://gl-transitions.com/editor/Drop_Zone_Flicker
+
+## EdgeTransition
+
+Both images fade through black with their edges glowing
+
+- Tags: edges, fade
+- Parameters:
+  - `edge_thickness` (float = 0.001)
+  - `edge_brightness` (float = 8)
+- Author: Woohyun Kim
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/EdgeTransition.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/EdgeTransition.sksl
+- Preview: https://gl-transitions.com/editor/EdgeTransition
+
+## FilmBurn
+
+Glowing film-burn light leaks wash over the image and reveal the incoming one
+
+- Tags: burn, film, light-leak
+- Parameters:
+  - `Seed` (float = 2.31): Random seed
+- Author: Anastasia Dunbar
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/FilmBurn.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/FilmBurn.sksl
+- Preview: https://gl-transitions.com/editor/FilmBurn
+
+## Fold
+
+The incoming image unfolds from the left while the outgoing one folds away to the right
+
+- Tags: fold, slide, horizontal
+- Parameters: none
+- Author: nwoeanhinnogaehr
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Fold.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Fold.sksl
+- Preview: https://gl-transitions.com/editor/Fold
+
+## GlitchDisplace
+
+Blocks of the image are displaced in a glitch that flashes into the incoming image
+
+- Tags: glitch, displace
+- Parameters: none
+- Author: Matt DesLauriers
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/GlitchDisplace.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/GlitchDisplace.sksl
+- Preview: https://gl-transitions.com/editor/GlitchDisplace
+
+## GlitchMemories
+
+A crossfade with glitchy, color-shifted blocks
+
+- Tags: glitch, chromatic, blend
+- Parameters: none
+- Author: Gunnar Roth
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/GlitchMemories.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/GlitchMemories.sksl
+- Preview: https://gl-transitions.com/editor/GlitchMemories
+
+## GridFlip
+
+The image splits into a grid of tiles that flip one by one to the incoming image
+
+- Tags: grid, tiles, flip
+- Parameters:
+  - `size` (ivec2 = ivec2(4, 4)): Number of tiles (columns, rows)
+  - `pause` (float = 0.1)
+  - `dividerWidth` (float = 0.05)
+  - `bgcolor` (vec4 = vec4(0, 0, 0, 1)) [color]: Color behind the tiles
+  - `randomness` (float = 0.1)
+- Author: TimDonselaar
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/GridFlip.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/GridFlip.sksl
+- Preview: https://gl-transitions.com/editor/GridFlip
+
+## HSVfade
+
+A crossfade through the HSV color space that cycles through hues
+
+- Tags: fade, color, hue
+- Parameters: none
+- Author: nwoeanhinnogaehr
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/HSVfade.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/HSVfade.sksl
+- Preview: https://gl-transitions.com/editor/HSVfade
+
+## HorizontalClose
+
+The incoming image closes in from the top and bottom edges toward the middle
+
+- Tags: wipe, split
+- Parameters: none
+- Author: martiniti
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/HorizontalClose.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/HorizontalClose.sksl
+- Preview: https://gl-transitions.com/editor/HorizontalClose
+
+## HorizontalOpen
+
+The incoming image opens from a line in the middle toward the top and bottom edges
+
+- Tags: wipe, split
+- Parameters: none
+- Author: martiniti
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/HorizontalOpen.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/HorizontalOpen.sksl
+- Preview: https://gl-transitions.com/editor/HorizontalOpen
+
+## InvertedPageCurl
+
+The outgoing image curls away like a page, revealing the incoming one
+
+- Tags: page, curl, 3d
+- Parameters: none
+- Author: Hewlett-Packard
+- License: BSD 3 Clause
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/InvertedPageCurl.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/InvertedPageCurl.sksl
+- Preview: https://gl-transitions.com/editor/InvertedPageCurl
+
+## LeftRight
+
+The outgoing image shrinks away to the left while the incoming one slides in from the right
+
+- Tags: slide, zoom, horizontal
+- Parameters: none
+- Author: zhmy
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/LeftRight.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/LeftRight.sksl
+- Preview: https://gl-transitions.com/editor/LeftRight
+
+## LinearBlur
+
+A crossfade through a blur
+
+- Tags: blur, blend
+- Parameters:
+  - `intensity` (float = 0.1): Amount of blur
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/LinearBlur.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/LinearBlur.sksl
+- Preview: https://gl-transitions.com/editor/LinearBlur
+
+## Mosaic
+
+The view pans across a mosaic of rotated tiles from both images and settles on the incoming one
+
+- Tags: mosaic, tiles, zoom
+- Parameters:
+  - `endx` (int = 2)
+  - `endy` (int = -1)
+- Author: Xaychru
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Mosaic.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Mosaic.sksl
+- Preview: https://gl-transitions.com/editor/Mosaic
+
+## Overexposure
+
+A crossfade through a washed-out, overexposed white
+
+- Tags: flash, light, fade
+- Parameters:
+  - `strength` (float = 0.6): Amount of overexposure
+- Author: Ben Zhang
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Overexposure.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Overexposure.sksl
+- Preview: https://gl-transitions.com/editor/Overexposure
+
+## PolkaDotsCurtain
+
+The incoming image appears through growing polka dots
+
+- Tags: dots, pattern
+- Parameters:
+  - `dots` (float = 20): Number of dots across the image
+  - `center` (vec2 = vec2(0, 0))
+- Author: bobylito
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/PolkaDotsCurtain.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/PolkaDotsCurtain.sksl
+- Preview: https://gl-transitions.com/editor/PolkaDotsCurtain
+
+## PuzzleRight
+
+The image splits into a grid of tiles that flip one by one to the incoming image
+
+- Tags: grid, tiles, flip
+- Parameters:
+  - `size` (ivec2 = ivec2(4, 4))
+  - `pause` (float = 0.1)
+  - `dividerWidth` (float = 0.005)
+- Author: JustKirillS
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/PuzzleRight.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/PuzzleRight.sksl
+- Preview: https://gl-transitions.com/editor/PuzzleRight
+
+## Radial
+
+A radial wipe that sweeps around the center like a clock hand
+
+- Tags: wipe, radial, clock
+- Parameters:
+  - `smoothness` (float = 1)
+- Author: Xaychru
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Radial.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Radial.sksl
+- Preview: https://gl-transitions.com/editor/Radial
+
+## Rectangle
+
+A rectangle grows from the center to cover the outgoing image, then shrinks to reveal the incoming one
+
+- Tags: box, shape, iris
+- Parameters:
+  - `bgcolor` (vec4 = vec4(0, 0, 0, 1)) [color]: Color of the rectangle
+- Author: martiniti
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Rectangle.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Rectangle.sksl
+- Preview: https://gl-transitions.com/editor/Rectangle
+
+## RectangleCrop
+
+The outgoing image shrinks into a small rectangle over a background color, then the incoming one grows from it
+
+- Tags: box, iris, zoom
+- Parameters:
+  - `bgcolor` (vec4 = vec4(0, 0, 0, 1)) [color]: Background color
+- Author: martiniti
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/RectangleCrop.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/RectangleCrop.sksl
+- Preview: https://gl-transitions.com/editor/RectangleCrop
+
+## Revolve_Left
+
+The outgoing image swirls and zooms with motion blur into the incoming one
+
+- Tags: swirl, zoom, rotate, blur
+- Parameters:
+  - `center` (vec2 = vec2(0.46, 0.52)): Center of the swirl
+  - `direction` (float = -1)
+  - `maxRotation` (float = 1.95)
+  - `peakZoom` (float = 2.22)
+  - `swirl` (float = 2.85)
+  - `barrel` (float = 0.38)
+  - `motionBlur` (float = 1)
+  - `switchStart` (float = 0.3)
+  - `switchEnd` (float = 0.5)
+  - `shadow` (float = 0.16)
+- Author: bread
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Revolve_Left.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Revolve_Left.sksl
+- Preview: https://gl-transitions.com/editor/Revolve_Left
+
+## Rolls
+
+The outgoing image rolls away around a corner, revealing the incoming one
+
+- Tags: rotate, roll
+- Parameters:
+  - `type` (int = 0) [range 0 to 3 step 1]: Corner to roll around
+  - `RotDown` (bool = false): Roll the outgoing image down instead of up
+- Author: Mark Craig
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Rolls.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Rolls.sksl
+- Preview: https://gl-transitions.com/editor/Rolls
+
+## RotateScaleVanish
+
+The outgoing image spins and shrinks away over the incoming one
+
+- Tags: rotate, zoom, spin
+- Parameters:
+  - `FadeInSecond` (bool = true): Fade in the incoming image
+  - `ReverseEffect` (bool = false): Run the effect in reverse
+  - `ReverseRotation` (bool = false): Rotate the other way
+- Author: Mark Craig
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/RotateScaleVanish.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/RotateScaleVanish.sksl
+- Preview: https://gl-transitions.com/editor/RotateScaleVanish
+
+## SimpleFlip
+
+The outgoing image flips around the vertical axis into the incoming one
+
+- Tags: flip, horizontal
+- Parameters: none
+- Author: nwoeanhinnogaehr
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/SimpleFlip.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/SimpleFlip.sksl
+- Preview: https://gl-transitions.com/editor/SimpleFlip
+
+## SimpleZoom
+
+Zooms into the outgoing image, then fades to the incoming one
+
+- Tags: zoom, fade
+- Parameters:
+  - `zoom_quickness` (float = 0.8) [range 0.2 to 1]: Part of the transition spent zooming
+- Author: 0gust1
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/SimpleZoom.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/SimpleZoom.sksl
+- Preview: https://gl-transitions.com/editor/SimpleZoom
+
+## SimpleZoomOut
+
+The incoming image zooms out into place while fading in
+
+- Tags: zoom, fade
+- Parameters:
+  - `zoom_quickness` (float = 0.8) [range 0.2 to 1]: Part of the transition spent zooming
+  - `fade` (bool = true): Fade instead of cutting to the incoming image
+- Author: Tianshuo
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/SimpleZoomOut.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/SimpleZoomOut.sksl
+- Preview: https://gl-transitions.com/editor/SimpleZoomOut
+
+## Slides
+
+The outgoing image slides out, or the incoming one slides in, toward an edge, a corner or the center
+
+- Tags: slide, directional
+- Parameters:
+  - `type` (int = 0)
+  - `In` (bool = false): Slide the incoming image in instead of the outgoing one out
+- Author: Mark Craig
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Slides.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Slides.sksl
+- Preview: https://gl-transitions.com/editor/Slides
+
+## StarWipe
+
+A growing star reveals the incoming image
+
+- Tags: wipe, shape, star
+- Parameters:
+  - `border_thickness` (float = 0.01): Thickness of the star's border
+  - `star_rotation` (float = 0.75)
+  - `border_color` (vec4 = vec4(1, 1, 1, 1)) [color]: Color of the star's border
+  - `star_center` (vec2 = vec2(0.5, 0.5)): Center of the star
+- Author: Ben Lucas
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/StarWipe.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/StarWipe.sksl
+- Preview: https://gl-transitions.com/editor/StarWipe
+
+## StaticFade
+
+Cuts to the incoming image halfway, hidden behind a burst of TV static
+
+- Tags: static, noise, retro
+- Parameters:
+  - `n_noise_pixels` (float = 200)
+  - `static_luminosity` (float = 0.8)
+- Author: Ben Lucas
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/StaticFade.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/StaticFade.sksl
+- Preview: https://gl-transitions.com/editor/StaticFade
+
+## StereoViewer
+
+Both images shrink into rounded cards that swap, like a stereo viewer toy
+
+- Tags: cards, zoom, retro
+- Parameters:
+  - `zoom` (float = 0.88) [range 0.5 to 1]: How much the images zoom out
+  - `corner_radius` (float = 0.22)
+- Author: Ted Schundler
+- License: BSD 2 Clause
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/StereoViewer.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/StereoViewer.sksl
+- Preview: https://gl-transitions.com/editor/StereoViewer
+
+## StripDatamoshGlitch
+
+A datamosh glitch: torn strips, chroma shifts and scan noise drag the outgoing image into the incoming one
+
+- Tags: glitch, datamosh, chromatic
+- Parameters:
+  - `strength` (float = 1)
+  - `horizontalBars` (float = 42)
+  - `verticalSlits` (float = 18)
+  - `tear` (float = 0.18)
+  - `chroma` (float = 0.032)
+  - `residue` (float = 0.62)
+  - `noiseAmount` (float = 0.16)
+  - `scanAmount` (float = 0.13)
+  - `flashAmount` (float = 0.2)
+- Author: bread
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/StripDatamoshGlitch.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/StripDatamoshGlitch.sksl
+- Preview: https://gl-transitions.com/editor/StripDatamoshGlitch
+
+## Swirl
+
+Both images swirl around the center while crossfading
+
+- Tags: swirl, rotate, blend
+- Parameters: none
+- Author: Sergey Kosarevsky
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Swirl.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/Swirl.sksl
+- Preview: https://gl-transitions.com/editor/Swirl
+
+## TVStatic
+
+Cuts to full-screen TV static, then to the incoming image
+
+- Tags: static, noise, retro
+- Parameters:
+  - `offset` (float = 0.05): Part of the transition, at each end, that shows the images instead of static
+- Author: Brandon Anzaldi
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/TVStatic.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/TVStatic.sksl
+- Preview: https://gl-transitions.com/editor/TVStatic
+
+## TilesWave
+
+The incoming image is revealed tile by tile in a diagonal wave
+
+- Tags: tiles, wave, wipe
+- Parameters:
+  - `tileCount` (ivec2 = ivec2(8, 8)): Number of tiles (columns, rows)
+  - `flipX` (bool = true)
+  - `flipY` (bool = false)
+- Author: numb3r23
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/TilesWave.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/TilesWave.sksl
+- Preview: https://gl-transitions.com/editor/TilesWave
+
+## TopBottom
+
+The outgoing image shrinks away upward while the incoming one slides in from the bottom
+
+- Tags: slide, zoom, vertical
+- Parameters: none
+- Author: zhmy
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/TopBottom.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/TopBottom.sksl
+- Preview: https://gl-transitions.com/editor/TopBottom
+
+## VerticalClose
+
+The incoming image closes in from the left and right edges toward the middle
+
+- Tags: wipe, split
+- Parameters: none
+- Author: martiniti
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/VerticalClose.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/VerticalClose.sksl
+- Preview: https://gl-transitions.com/editor/VerticalClose
+
+## VerticalOpen
+
+The incoming image opens from a line in the middle toward the left and right edges
+
+- Tags: wipe, split
+- Parameters: none
+- Author: martiniti
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/VerticalOpen.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/VerticalOpen.sksl
+- Preview: https://gl-transitions.com/editor/VerticalOpen
+
+## WaterDrop
+
+Ripples spread from the center like a drop falling into water, crossfading to the incoming image
+
+- Tags: ripple, water, blend
+- Parameters:
+  - `amplitude` (float = 30): Frequency of the ripples
+  - `speed` (float = 30): Speed of the ripples
+- Author: Paweł Płóciennik
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/WaterDrop.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/WaterDrop.sksl
+- Preview: https://gl-transitions.com/editor/WaterDrop
+
+## ZoomInCircles
+
+Concentric rings of the outgoing image zoom at different speeds before revealing the incoming one
+
+- Tags: zoom, circle
+- Parameters: none
+- Author: dycm8009
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/ZoomInCircles.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/ZoomInCircles.sksl
+- Preview: https://gl-transitions.com/editor/ZoomInCircles
+
+## ZoomLeftWipe
+
+Zooms into the outgoing image, then the incoming one wipes in from right to left
+
+- Tags: zoom, wipe, horizontal
+- Parameters:
+  - `zoom_quickness` (float = 0.8): Part of the first half spent zooming (capped at 0.5)
+- Author: Handk
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/ZoomLeftWipe.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/ZoomLeftWipe.sksl
+- Preview: https://gl-transitions.com/editor/ZoomLeftWipe
+
+## ZoomRigthWipe
+
+Zooms into the outgoing image, then the incoming one wipes in from left to right
+
+- Tags: zoom, wipe, horizontal
+- Parameters:
+  - `zoom_quickness` (float = 0.8): Part of the first half spent zooming (capped at 0.5)
+- Author: Handk
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/ZoomRigthWipe.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/ZoomRigthWipe.sksl
+- Preview: https://gl-transitions.com/editor/ZoomRigthWipe
+
+## angular
+
+A wipe that sweeps around the center from a starting angle
+
+- Tags: wipe, radial, clock
+- Parameters:
+  - `startingAngle` (float = 90) [range 0 to 360]: Angle where the wipe starts, in degrees
+- Author: Fernando Kuteken
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/angular.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/angular.sksl
+- Preview: https://gl-transitions.com/editor/angular
+
+## burn
+
+A crossfade that brightens toward a color in the middle
+
+- Tags: fade, color, flash
+- Parameters:
+  - `color` (vec3 = vec3(0.9, 0.4, 0.2)) [color]: Color the images brighten toward
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/burn.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/burn.sksl
+- Preview: https://gl-transitions.com/editor/burn
+
+## burn0
+
+The outgoing image burns away in noisy, glowing patches
+
+- Tags: burn, fire, noise
+- Parameters:
+  - `burnColor` (vec3 = vec3(1, 0.5, 0)) [color]: Color of the burning edges
+- Author: liubailin2020@gmail.com
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/burn0.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/burn0.sksl
+- Preview: https://gl-transitions.com/editor/burn0
+
+## cannabisleaf
+
+A cannabis-leaf shape grows from the center to reveal the incoming image
+
+- Tags: shape, wipe
+- Parameters: none
+- Author: @Flexi23
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/cannabisleaf.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/cannabisleaf.sksl
+- Preview: https://gl-transitions.com/editor/cannabisleaf
+
+## chessboard
+
+A chessboard pattern of squares reveals the incoming image
+
+- Tags: grid, squares, pattern
+- Parameters:
+  - `grid_num` (float = 10): Number of squares per row
+- Author: lql
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/chessboard.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/chessboard.sksl
+- Preview: https://gl-transitions.com/editor/chessboard
+
+## circle
+
+The outgoing image closes into a circle over a background color, then the incoming one opens from it
+
+- Tags: circle, iris, shape
+- Parameters:
+  - `center` (vec2 = vec2(0.5, 0.5)): Center of the circle
+  - `backColor` (vec3 = vec3(0.1, 0.1, 0.1)) [color]: Background color
+- Author: Fernando Kuteken
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/circle.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/circle.sksl
+- Preview: https://gl-transitions.com/editor/circle
+
+## circleopen
+
+A soft-edged circle opens from the center to reveal the incoming image
+
+- Tags: circle, iris, wipe
+- Parameters:
+  - `smoothness` (float = 0.3): Softness of the circle's edge
+  - `opening` (bool = true): Open the circle; false closes it instead
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/circleopen.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/circleopen.sksl
+- Preview: https://gl-transitions.com/editor/circleopen
+
+## colorphase
+
+A crossfade in which each color channel changes at a different time
+
+- Tags: fade, color
+- Parameters:
+  - `fromStep` (vec4 = vec4(0, 0.2, 0.4, 0)) [range 0 to 1]: When each channel (r, g, b, a) starts changing
+  - `toStep` (vec4 = vec4(0.6, 0.8, 1, 1)) [range 0 to 1]: When each channel (r, g, b, a) finishes changing
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/colorphase.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/colorphase.sksl
+- Preview: https://gl-transitions.com/editor/colorphase
+
+## coord-from-in
+
+A crossfade in which the colors of one image displace the other
+
+- Tags: displace, distort, blend
+- Parameters: none
+- Author: haiyoucuv
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/coord-from-in.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/coord-from-in.sksl
+- Preview: https://gl-transitions.com/editor/coord-from-in
+
+## crosshatch
+
+The incoming image appears through a crosshatch of lines spreading from the center
+
+- Tags: pattern, lines, noise
+- Parameters:
+  - `center` (vec2 = vec2(0.5, 0.5)): Point the lines spread from
+  - `threshold` (float = 3)
+  - `fadeEdge` (float = 0.1)
+- Author: pthrasher
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/crosshatch.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/crosshatch.sksl
+- Preview: https://gl-transitions.com/editor/crosshatch
+
+## crosswarp
+
+The outgoing image zooms in while the incoming one zooms out into place, sweeping from right to left
+
+- Tags: warp, zoom, horizontal
+- Parameters: none
+- Author: Eke Péter <peterekepeter@gmail.com>
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/crosswarp.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/crosswarp.sksl
+- Preview: https://gl-transitions.com/editor/crosswarp
+
+## cube
+
+The two images are faces of a rotating 3D cube, with a floor reflection
+
+- Tags: 3d, cube, rotate, reflection
+- Parameters:
+  - `persp` (float = 0.7) [range 0 to 1]: Amount of perspective
+  - `unzoom` (float = 0.3)
+  - `reflection` (float = 0.4) [range 0 to 1]: Strength of the reflection
+  - `floating` (float = 3)
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/cube.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/cube.sksl
+- Preview: https://gl-transitions.com/editor/cube
+
+## directional-easing
+
+Like Directional, with an eased movement
+
+- Tags: slide, push, directional
+- Parameters:
+  - `direction` (vec2 = vec2(0, 1)): Direction of the movement
+- Author: Max Plotnikov
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/directional-easing.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/directional-easing.sksl
+- Preview: https://gl-transitions.com/editor/directional-easing
+
+## directionalwarp
+
+A diagonal wipe with a warped, smeared edge
+
+- Tags: wipe, warp, directional
+- Parameters:
+  - `smoothness` (float = 0.1): Softness of the edge
+  - `direction` (vec2 = vec2(-1, 1)): Direction of the wipe
+- Author: pschroen
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/directionalwarp.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/directionalwarp.sksl
+- Preview: https://gl-transitions.com/editor/directionalwarp
+
+## directionalwipe
+
+A soft-edged diagonal wipe
+
+- Tags: wipe, directional
+- Parameters:
+  - `direction` (vec2 = vec2(1, -1)): Direction of the wipe
+  - `smoothness` (float = 0.5): Softness of the edge
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/directionalwipe.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/directionalwipe.sksl
+- Preview: https://gl-transitions.com/editor/directionalwipe
+
+## displacement
+
+A crossfade in which a displacement map (an extra grayscale texture) warps both images
+
+- Tags: displace, distort, blend
+- Parameters:
+  - `strength` (float = 0.5): Strength of the displacement
+- Extra textures: `displacementMap` (sampler2D)
+- Author: Travis Fischer
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/displacement.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/displacement.sksl
+- Preview: https://gl-transitions.com/editor/displacement
+
+## dissolve
+
+The incoming image spreads over the outgoing one with a hot, glowing edge
+
+- Tags: dissolve, burn, glow
+- Parameters:
+  - `uLineWidth` (float = 0.1)
+  - `uSpreadClr` (vec3 = vec3(1, 0, 0)) [color]: Color of the spreading edge
+  - `uHotClr` (vec3 = vec3(0.9, 0.9, 0.2)) [color]: Color of the hottest part of the edge
+  - `uPow` (float = 5)
+  - `uIntensity` (float = 1)
+- Author: hjm1fb
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/dissolve.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/dissolve.sksl
+- Preview: https://gl-transitions.com/editor/dissolve
+
+## doorway
+
+The outgoing image opens like double doors as the incoming one comes forward, with a floor reflection
+
+- Tags: doors, 3d, reflection
+- Parameters:
+  - `reflection` (float = 0.4): Strength of the reflection
+  - `perspective` (float = 0.4): Amount of perspective
+  - `depth` (float = 3)
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/doorway.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/doorway.sksl
+- Preview: https://gl-transitions.com/editor/doorway
+
+## fade
+
+A linear crossfade between the two images
+
+- Tags: fade, blend
+- Parameters: none
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/fade.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/fade.sksl
+- Preview: https://gl-transitions.com/editor/fade
+
+## fadecolor
+
+A fade through a solid color, black by default
+
+- Tags: fade, color
+- Parameters:
+  - `color` (vec3 = vec3(0, 0, 0)) [color]: Color to fade through
+  - `colorPhase` (float = 0.4) [range 0 to 1]: How long the color shows in the middle
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/fadecolor.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/fadecolor.sksl
+- Preview: https://gl-transitions.com/editor/fadecolor
+
+## fadegrayscale
+
+A crossfade through grayscale
+
+- Tags: fade, grayscale, color
+- Parameters:
+  - `intensity` (float = 0.3) [range 0 to 1]: How long the grayscale phase lasts
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/fadegrayscale.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/fadegrayscale.sksl
+- Preview: https://gl-transitions.com/editor/fadegrayscale
+
+## flyeye
+
+The image breaks into a fly's-eye grid of lenses with color separation
+
+- Tags: lens, distort, chromatic
+- Parameters:
+  - `size` (float = 0.04)
+  - `zoom` (float = 50)
+  - `colorSeparation` (float = 0.3)
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/flyeye.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/flyeye.sksl
+- Preview: https://gl-transitions.com/editor/flyeye
+
+## fragment
+
+The outgoing image shatters into fragments that fly away
+
+- Tags: shatter, fragments
+- Parameters: none
+- Author: lbl
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/fragment.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/fragment.sksl
+- Preview: https://gl-transitions.com/editor/fragment
+
+## heart
+
+A heart shape grows from the center to reveal the incoming image
+
+- Tags: shape, wipe, heart
+- Parameters: none
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/heart.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/heart.sksl
+- Preview: https://gl-transitions.com/editor/heart
+
+## hexagonalize
+
+Both images turn into hexagons, crossfade, then sharpen again
+
+- Tags: pixelate, hexagon, blend
+- Parameters:
+  - `steps` (int = 50)
+  - `horizontalHexagons` (float = 20): Number of hexagons across
+- Author: Fernando Kuteken
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/hexagonalize.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/hexagonalize.sksl
+- Preview: https://gl-transitions.com/editor/hexagonalize
+
+## kaleidoscope
+
+A crossfade through a spinning kaleidoscope
+
+- Tags: kaleidoscope, distort, blend
+- Parameters:
+  - `speed` (float = 1)
+  - `angle` (float = 1)
+  - `power` (float = 1.5)
+- Author: nwoeanhinnogaehr
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/kaleidoscope.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/kaleidoscope.sksl
+- Preview: https://gl-transitions.com/editor/kaleidoscope
+
+## luma
+
+A wipe that follows the brightness of a grayscale mask (the luma texture)
+
+- Tags: wipe, luma, mask
+- Parameters: none
+- Extra textures: `luma` (sampler2D)
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/luma.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/luma.sksl
+- Preview: https://gl-transitions.com/editor/luma
+
+## luminance_melt
+
+The outgoing image melts away in noisy vertical streaks, depending on its brightness
+
+- Tags: melt, noise, luma
+- Parameters:
+  - `direction` (bool = true): Direction of the melt (false: up, true: down)
+  - `l_threshold` (float = 0.8) [range 0 to 1]: Luminance threshold
+  - `above` (bool = false): Melt the parts above the threshold instead of below
+- Author: 0gust1
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/luminance_melt.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/luminance_melt.sksl
+- Preview: https://gl-transitions.com/editor/luminance_melt
+
+## morph
+
+A crossfade in which each image is displaced by the other's colors, like a morph
+
+- Tags: morph, distort, blend
+- Parameters:
+  - `strength` (float = 0.1): Strength of the displacement
+- Author: paniq
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/morph.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/morph.sksl
+- Preview: https://gl-transitions.com/editor/morph
+
+## mosaic_transition
+
+Both images break into mosaic blocks that blend, then sharpen into the incoming image
+
+- Tags: mosaic, pixelate, blend
+- Parameters:
+  - `mosaicNum` (float = 10): Number of mosaic blocks
+- Author: YueDev
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/mosaic_transition.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/mosaic_transition.sksl
+- Preview: https://gl-transitions.com/editor/mosaic_transition
+
+## multiply_blend
+
+A crossfade through the multiplied blend of both images
+
+- Tags: blend, fade
+- Parameters: none
+- Author: Fernando Kuteken
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/multiply_blend.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/multiply_blend.sksl
+- Preview: https://gl-transitions.com/editor/multiply_blend
+
+## old_tv_lost_signal
+
+A crossfade with drifting tracking lines and tearing, like a TV losing its signal
+
+- Tags: retro, glitch, scanlines
+- Parameters: none
+- Author: mernking (gitlab.com/Godswork)
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/old_tv_lost_signal.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/old_tv_lost_signal.sksl
+- Preview: https://gl-transitions.com/editor/old_tv_lost_signal
+
+## parametric_glitch
+
+A crossfade with glitchy horizontal bands and color shifts
+
+- Tags: glitch, blend
+- Parameters:
+  - `ampx` (float = 1): Horizontal amplitude of the glitch
+  - `ampy` (float = 1): Vertical amplitude of the glitch
+- Author: Yoni Maltsman @friendlyspinach
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/parametric_glitch.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/parametric_glitch.sksl
+- Preview: https://gl-transitions.com/editor/parametric_glitch
+
+## perlin
+
+The incoming image appears through blobs of Perlin noise
+
+- Tags: noise, dissolve
+- Parameters:
+  - `scale` (float = 4): Scale of the noise; higher values make smaller blobs
+  - `smoothness` (float = 0.01): Softness of the blob edges
+  - `seed` (float = 12.9898): Random seed
+- Author: Rich Harris
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/perlin.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/perlin.sksl
+- Preview: https://gl-transitions.com/editor/perlin
+
+## pinwheel
+
+A spinning pinwheel reveals the incoming image
+
+- Tags: pinwheel, radial, rotate
+- Parameters:
+  - `speed` (float = 2): Rotation speed
+- Author: Mr Speaker
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/pinwheel.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/pinwheel.sksl
+- Preview: https://gl-transitions.com/editor/pinwheel
+
+## pixelize
+
+Both images pixelate, crossfade, then sharpen again
+
+- Tags: pixelate, blend
+- Parameters:
+  - `squaresMin` (ivec2 = ivec2(20, 20)): Number of squares at the strongest pixelation
+  - `steps` (int = 50): Number of pixelation steps; 0 for a continuous effect
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/pixelize.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/pixelize.sksl
+- Preview: https://gl-transitions.com/editor/pixelize
+
+## polar_function
+
+A flower shape with several petals grows to reveal the incoming image
+
+- Tags: shape, wipe, polar
+- Parameters:
+  - `segments` (int = 5): Number of petals
+- Author: Fernando Kuteken
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/polar_function.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/polar_function.sksl
+- Preview: https://gl-transitions.com/editor/polar_function
+
+## powerKaleido
+
+The image folds into an animated kaleidoscope before revealing the incoming one
+
+- Tags: kaleidoscope, distort
+- Parameters:
+  - `scale` (float = 2)
+  - `z` (float = 1.5)
+  - `speed` (float = 5)
+- Author: Boundless
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/powerKaleido.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/powerKaleido.sksl
+- Preview: https://gl-transitions.com/editor/powerKaleido
+
+## randomNoisex
+
+The incoming image appears pixel by pixel in random noise
+
+- Tags: dissolve, noise
+- Parameters: none
+- Author: towrabbit
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/randomNoisex.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/randomNoisex.sksl
+- Preview: https://gl-transitions.com/editor/randomNoisex
+
+## randomsquares
+
+The incoming image appears in random squares
+
+- Tags: squares, grid, dissolve
+- Parameters:
+  - `size` (ivec2 = ivec2(10, 10)): Number of squares (columns, rows)
+  - `smoothness` (float = 0.5): Softness of each square's switch
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/randomsquares.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/randomsquares.sksl
+- Preview: https://gl-transitions.com/editor/randomsquares
+
+## ripple
+
+Ripples spread from the center while crossfading
+
+- Tags: ripple, wave, blend
+- Parameters:
+  - `amplitude` (float = 100): Frequency of the ripples
+  - `speed` (float = 50): Speed of the ripples
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/ripple.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/ripple.sksl
+- Preview: https://gl-transitions.com/editor/ripple
+
+## rotateTransition
+
+The images spin around the center while crossfading
+
+- Tags: rotate, spin, blend
+- Parameters: none
+- Author: haiyoucuv
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/rotateTransition.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/rotateTransition.sksl
+- Preview: https://gl-transitions.com/editor/rotateTransition
+
+## rotate_scale_fade
+
+The outgoing image spins and zooms while fading to the incoming one, over a background color
+
+- Tags: rotate, zoom, fade
+- Parameters:
+  - `center` (vec2 = vec2(0.5, 0.5)): Center of the rotation
+  - `rotations` (float = 1): Number of turns
+  - `scale` (float = 8): Maximum zoom
+  - `backColor` (vec4 = vec4(0.15, 0.15, 0.15, 1)) [color]: Background color
+- Author: Fernando Kuteken
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/rotate_scale_fade.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/rotate_scale_fade.sksl
+- Preview: https://gl-transitions.com/editor/rotate_scale_fade
+
+## scale-in
+
+The incoming image scales in from the center while fading in
+
+- Tags: zoom, fade
+- Parameters: none
+- Author: haiyoucuv
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/scale-in.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/scale-in.sksl
+- Preview: https://gl-transitions.com/editor/scale-in
+
+## splitSlideInHorizontal
+
+The incoming image slides in as two halves moving horizontally in opposite directions
+
+- Tags: slide, split, horizontal
+- Parameters:
+  - `reverse` (bool = false): Swap the directions of the halves
+- Author: OllyOllyOlly
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/splitSlideInHorizontal.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/splitSlideInHorizontal.sksl
+- Preview: https://gl-transitions.com/editor/splitSlideInHorizontal
+
+## splitSlideInOutHorizontal
+
+The halves of both images slide horizontally in opposite directions, out and in at once
+
+- Tags: slide, split, horizontal
+- Parameters:
+  - `reverse` (bool = false): Swap the directions of the halves
+- Author: OllyOllyOlly
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/splitSlideInOutHorizontal.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/splitSlideInOutHorizontal.sksl
+- Preview: https://gl-transitions.com/editor/splitSlideInOutHorizontal
+
+## splitSlideInOutVertical
+
+The halves of both images slide vertically in opposite directions, out and in at once
+
+- Tags: slide, split, vertical
+- Parameters:
+  - `reverse` (bool = false): Swap the directions of the halves
+- Author: OllyOllyOlly
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/splitSlideInOutVertical.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/splitSlideInOutVertical.sksl
+- Preview: https://gl-transitions.com/editor/splitSlideInOutVertical
+
+## splitSlideInVertical
+
+The incoming image slides in as two halves moving vertically in opposite directions
+
+- Tags: slide, split, vertical
+- Parameters:
+  - `reverse` (bool = false): Swap the directions of the halves
+- Author: OllyOllyOlly
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/splitSlideInVertical.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/splitSlideInVertical.sksl
+- Preview: https://gl-transitions.com/editor/splitSlideInVertical
+
+## splitSlideOutHorizontal
+
+The outgoing image slides out as two halves moving horizontally in opposite directions
+
+- Tags: slide, split, horizontal
+- Parameters:
+  - `reverse` (bool = false): Swap the directions of the halves
+- Author: OllyOllyOlly
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/splitSlideOutHorizontal.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/splitSlideOutHorizontal.sksl
+- Preview: https://gl-transitions.com/editor/splitSlideOutHorizontal
+
+## splitSlideOutVertical
+
+The outgoing image slides out as two halves moving vertically in opposite directions
+
+- Tags: slide, split, vertical
+- Parameters:
+  - `reverse` (bool = false): Swap the directions of the halves
+- Author: OllyOllyOlly
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/splitSlideOutVertical.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/splitSlideOutVertical.sksl
+- Preview: https://gl-transitions.com/editor/splitSlideOutVertical
+
+## squareswire
+
+Squares grow along a diagonal sweep to reveal the incoming image
+
+- Tags: squares, grid, wipe, directional
+- Parameters:
+  - `squares` (ivec2 = ivec2(10, 10)): Number of squares (columns, rows)
+  - `direction` (vec2 = vec2(1, -0.5)): Direction of the sweep
+  - `smoothness` (float = 1.6): Softness of the sweep
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/squareswire.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/squareswire.sksl
+- Preview: https://gl-transitions.com/editor/squareswire
+
+## squeeze
+
+The outgoing image is squeezed into a line with color separation, revealing the incoming one
+
+- Tags: squeeze, chromatic, vertical
+- Parameters:
+  - `colorSeparation` (float = 0.04): Amount of color separation
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/squeeze.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/squeeze.sksl
+- Preview: https://gl-transitions.com/editor/squeeze
+
+## static_wipe
+
+A wipe from top to bottom with a band of TV static at its edge
+
+- Tags: wipe, static, noise, vertical
+- Parameters:
+  - `u_transitionUpToDown` (bool = true): Wipe from top to bottom; false wipes from bottom to top
+  - `u_max_static_span` (float = 0.5): Maximum height of the static band
+- Author: Ben Lucas
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/static_wipe.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/static_wipe.sksl
+- Preview: https://gl-transitions.com/editor/static_wipe
+
+## swap
+
+The two images swap places in 3D, with a floor reflection
+
+- Tags: 3d, swap, reflection
+- Parameters:
+  - `reflection` (float = 0.4): Strength of the reflection
+  - `perspective` (float = 0.2): Amount of perspective
+  - `depth` (float = 3)
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/swap.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/swap.sksl
+- Preview: https://gl-transitions.com/editor/swap
+
+## tangentMotionBlur
+
+The outgoing image is flung away along a curve with motion blur
+
+- Tags: motion-blur, rotate, slide
+- Parameters: none
+- Author: chenkai
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/tangentMotionBlur.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/tangentMotionBlur.sksl
+- Preview: https://gl-transitions.com/editor/tangentMotionBlur
+
+## undulatingBurnOut
+
+A circle with a wavy edge burns out from the center to reveal the incoming image
+
+- Tags: circle, burn, wipe
+- Parameters:
+  - `smoothness` (float = 0.03): Softness of the edge
+  - `center` (vec2 = vec2(0.5, 0.5)): Center of the circle
+  - `color` (vec3 = vec3(0, 0, 0)) [color]: Color of the burning edge
+- Author: pthrasher
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/undulatingBurnOut.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/undulatingBurnOut.sksl
+- Preview: https://gl-transitions.com/editor/undulatingBurnOut
+
+## wind
+
+A ragged left-to-right wipe, as if the image was blown away by the wind
+
+- Tags: wipe, horizontal, noise
+- Parameters:
+  - `size` (float = 0.2) [range 0 to 1]: Width of the ragged edge
+  - `reversed` (bool = false): Wipe from right to left instead
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/wind.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/wind.sksl
+- Preview: https://gl-transitions.com/editor/wind
+
+## windowblinds
+
+A crossfade through horizontal window blinds
+
+- Tags: blinds, stripes, blend
+- Parameters: none
+- Author: Fabien Benetou
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/windowblinds.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/windowblinds.sksl
+- Preview: https://gl-transitions.com/editor/windowblinds
+
+## windowslice
+
+The incoming image appears through vertical slices that widen
+
+- Tags: slices, stripes, wipe
+- Parameters:
+  - `count` (float = 10): Number of slices
+  - `smoothness` (float = 0.5): Softness of the slices' edges
+- Author: gre
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/windowslice.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/windowslice.sksl
+- Preview: https://gl-transitions.com/editor/windowslice
+
+## wipeDown
+
+A hard-edged wipe from top to bottom
+
+- Tags: wipe, vertical
+- Parameters: none
+- Author: Jake Nelson
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/wipeDown.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/wipeDown.sksl
+- Preview: https://gl-transitions.com/editor/wipeDown
+
+## wipeLeft
+
+A hard-edged wipe from right to left
+
+- Tags: wipe, horizontal
+- Parameters: none
+- Author: Jake Nelson
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/wipeLeft.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/wipeLeft.sksl
+- Preview: https://gl-transitions.com/editor/wipeLeft
+
+## wipeRight
+
+A hard-edged wipe from left to right
+
+- Tags: wipe, horizontal
+- Parameters: none
+- Author: Jake Nelson
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/wipeRight.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/wipeRight.sksl
+- Preview: https://gl-transitions.com/editor/wipeRight
+
+## wipeUp
+
+A hard-edged wipe from bottom to top
+
+- Tags: wipe, vertical
+- Parameters: none
+- Author: Jake Nelson
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/wipeUp.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/wipeUp.sksl
+- Preview: https://gl-transitions.com/editor/wipeUp
+
+## x_axis_translation
+
+The outgoing image slides to the right, uncovering a crossfade to the incoming one
+
+- Tags: slide, horizontal, blend
+- Parameters: none
+- Author: lizhongjian
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/x_axis_translation.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/x_axis_translation.sksl
+- Preview: https://gl-transitions.com/editor/x_axis_translation
+
+## zoomInOut
+
+Zooms into the outgoing image until it blurs into a flat color, then out to the incoming one
+
+- Tags: zoom, blur
+- Parameters: none
+- Author: OllyOllyOlly
+- License: MIT
+- GLSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/zoomInOut.glsl
+- SkSL: https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/sksl/zoomInOut.sksl
+- Preview: https://gl-transitions.com/editor/zoomInOut