gl-transitions 1.75.0 → 1.76.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/llms.txt CHANGED
@@ -1,6 +1,6 @@
1
1
  # gl-transitions
2
2
 
3
- > 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.75.0 (npm).
3
+ > 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).
4
4
 
5
5
  Every transition is GLSL (WebGL 1 / GLSL ES 1.00) that implements `vec4 transition(vec2 uv)`. The host provides:
6
6
 
@@ -12,139 +12,139 @@ Every transition is GLSL (WebGL 1 / GLSL ES 1.00) that implements `vec4 transiti
12
12
 
13
13
  ## Docs
14
14
 
15
- - [Full catalog](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/llms-full.txt): every transition with its description, tags, parameters and source links
16
- - [Agent Skill](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/skills/gl-transitions/SKILL.md): how to pick a transition and wire it into WebGL, Skia, FFmpeg or editly
17
- - [Catalog JSON](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/gl-transitions.json): the same data as an array of objects (name, glsl, params, tags, ...), typed in index.d.ts
18
- - [Package README](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/README.md): files of the npm package and the SkSL contract
15
+ - [Full catalog](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/llms-full.txt): every transition with its description, tags, parameters and source links
16
+ - [Agent Skill](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/skills/gl-transitions/SKILL.md): how to pick a transition and wire it into WebGL, Skia, FFmpeg or editly
17
+ - [Catalog JSON](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/gl-transitions.json): the same data as an array of objects (name, glsl, params, tags, ...), typed in index.d.ts
18
+ - [Package README](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/README.md): files of the npm package and the SkSL contract
19
19
  - [Specification](https://github.com/gl-transitions/gl-transitions#gl-transition-specification-v1): GL Transition Specification v1
20
20
 
21
21
  ## Transitions
22
22
 
23
- - [AdvancedMosaic](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/AdvancedMosaic.glsl): Both images break into large blocks that blend, then sharpen into the incoming image (pixelate, mosaic, blend)
24
- - [BlockDissolve](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/BlockDissolve.glsl): The incoming image appears in small random blocks (dissolve, blocks, noise)
25
- - [BookFlip](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/BookFlip.glsl): The outgoing image turns like a book page from right to left, revealing the incoming one (page, flip, 3d)
26
- - [Bounce](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Bounce.glsl): The outgoing image drops out of the frame with a few bounces, revealing the incoming one (bounce, slide, vertical, shadow)
27
- - [BowTieHorizontal](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/BowTieHorizontal.glsl): Two triangles grow from the left and right edges into a bow tie that reveals the incoming image (wipe, shape, horizontal)
28
- - [BowTieVertical](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/BowTieVertical.glsl): Two triangles grow from the top and bottom edges into a bow tie that reveals the incoming image (wipe, shape, vertical)
29
- - [BowTieWithParameter](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/BowTieWithParameter.glsl): A bow-tie wipe with an adjustable shape that can run in reverse (wipe, shape)
30
- - [Box](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Box.glsl): The outgoing image shrinks into a box, toward the center or a corner, revealing the incoming one (box, zoom, shape)
31
- - [ButterflyWaveScrawler](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/ButterflyWaveScrawler.glsl): Wavy, color-separated ripples scramble the outgoing image into the incoming one (wave, distort, chromatic)
32
- - [CircleCrop](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/CircleCrop.glsl): The outgoing image closes into a circle over a background color, then the incoming one opens from it (circle, iris, shape)
33
- - [ColourDistance](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/ColourDistance.glsl): Pixels switch to the incoming image in order of how close their colors are (blend, color)
34
- - [CrazyParametricFun](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/CrazyParametricFun.glsl): The outgoing image is pulled along a parametric curve into a psychedelic swirl (distort, psychedelic)
35
- - [CrossZoom](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/CrossZoom.glsl): A crossfade through a strong zoom blur (zoom, blur, blend)
36
- - [DefocusBlur](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/DefocusBlur.glsl): A crossfade through an out-of-focus blur (blur, blend)
37
- - [Directional](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Directional.glsl): The incoming image pushes the outgoing one out in a given direction (slide, push, directional)
38
- - [DirectionalScaled](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/DirectionalScaled.glsl): Like Directional, with both images scaled down while they slide (slide, push, zoom, directional)
39
- - [DoomScreenTransition](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/DoomScreenTransition.glsl): The outgoing image melts down in uneven columns, like the Doom screen wipe (melt, columns, retro)
40
- - [Dreamy](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Dreamy.glsl): A crossfade with a gentle wavy distortion (wave, blend)
41
- - [DreamyZoom](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/DreamyZoom.glsl): Zooms and rotates into a bright flash, then out to the incoming image (zoom, rotate, flash)
42
- - [Drop_Zone_Flicker](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Drop_Zone_Flicker.glsl): A flickering glitch with RGB offset, ghosting and scanlines that flashes back to the outgoing image (glitch, flicker, chromatic, scanlines)
43
- - [EdgeTransition](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/EdgeTransition.glsl): Both images fade through black with their edges glowing (edges, fade)
44
- - [FilmBurn](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/FilmBurn.glsl): Glowing film-burn light leaks wash over the image and reveal the incoming one (burn, film, light-leak)
45
- - [Fold](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Fold.glsl): The incoming image unfolds from the left while the outgoing one folds away to the right (fold, slide, horizontal)
46
- - [GlitchDisplace](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/GlitchDisplace.glsl): Blocks of the image are displaced in a glitch that flashes into the incoming image (glitch, displace)
47
- - [GlitchMemories](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/GlitchMemories.glsl): A crossfade with glitchy, color-shifted blocks (glitch, chromatic, blend)
48
- - [GridFlip](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/GridFlip.glsl): The image splits into a grid of tiles that flip one by one to the incoming image (grid, tiles, flip)
49
- - [HSVfade](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/HSVfade.glsl): A crossfade through the HSV color space that cycles through hues (fade, color, hue)
50
- - [HorizontalClose](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/HorizontalClose.glsl): The incoming image closes in from the top and bottom edges toward the middle (wipe, split)
51
- - [HorizontalOpen](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/HorizontalOpen.glsl): The incoming image opens from a line in the middle toward the top and bottom edges (wipe, split)
52
- - [InvertedPageCurl](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/InvertedPageCurl.glsl): The outgoing image curls away like a page, revealing the incoming one (page, curl, 3d)
53
- - [LeftRight](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/LeftRight.glsl): The outgoing image shrinks away to the left while the incoming one slides in from the right (slide, zoom, horizontal)
54
- - [LinearBlur](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/LinearBlur.glsl): A crossfade through a blur (blur, blend)
55
- - [Mosaic](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Mosaic.glsl): The view pans across a mosaic of rotated tiles from both images and settles on the incoming one (mosaic, tiles, zoom)
56
- - [Overexposure](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Overexposure.glsl): A crossfade through a washed-out, overexposed white (flash, light, fade)
57
- - [PolkaDotsCurtain](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/PolkaDotsCurtain.glsl): The incoming image appears through growing polka dots (dots, pattern)
58
- - [PuzzleRight](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/PuzzleRight.glsl): The image splits into a grid of tiles that flip one by one to the incoming image (grid, tiles, flip)
59
- - [Radial](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Radial.glsl): A radial wipe that sweeps around the center like a clock hand (wipe, radial, clock)
60
- - [Rectangle](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Rectangle.glsl): A rectangle grows from the center to cover the outgoing image, then shrinks to reveal the incoming one (box, shape, iris)
61
- - [RectangleCrop](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/RectangleCrop.glsl): The outgoing image shrinks into a small rectangle over a background color, then the incoming one grows from it (box, iris, zoom)
62
- - [Revolve_Left](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Revolve_Left.glsl): The outgoing image swirls and zooms with motion blur into the incoming one (swirl, zoom, rotate, blur)
63
- - [Rolls](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Rolls.glsl): The outgoing image rolls away around a corner, revealing the incoming one (rotate, roll)
64
- - [RotateScaleVanish](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/RotateScaleVanish.glsl): The outgoing image spins and shrinks away over the incoming one (rotate, zoom, spin)
65
- - [SimpleFlip](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/SimpleFlip.glsl): The outgoing image flips around the vertical axis into the incoming one (flip, horizontal)
66
- - [SimpleZoom](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/SimpleZoom.glsl): Zooms into the outgoing image, then fades to the incoming one (zoom, fade)
67
- - [SimpleZoomOut](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/SimpleZoomOut.glsl): The incoming image zooms out into place while fading in (zoom, fade)
68
- - [Slides](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Slides.glsl): The outgoing image slides out, or the incoming one slides in, toward an edge, a corner or the center (slide, directional)
69
- - [StarWipe](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/StarWipe.glsl): A growing star reveals the incoming image (wipe, shape, star)
70
- - [StaticFade](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/StaticFade.glsl): Cuts to the incoming image halfway, hidden behind a burst of TV static (static, noise, retro)
71
- - [StereoViewer](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/StereoViewer.glsl): Both images shrink into rounded cards that swap, like a stereo viewer toy (cards, zoom, retro)
72
- - [StripDatamoshGlitch](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/StripDatamoshGlitch.glsl): A datamosh glitch: torn strips, chroma shifts and scan noise drag the outgoing image into the incoming one (glitch, datamosh, chromatic)
73
- - [Swirl](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/Swirl.glsl): Both images swirl around the center while crossfading (swirl, rotate, blend)
74
- - [TVStatic](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/TVStatic.glsl): Cuts to full-screen TV static, then to the incoming image (static, noise, retro)
75
- - [TilesWave](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/TilesWave.glsl): The incoming image is revealed tile by tile in a diagonal wave (tiles, wave, wipe)
76
- - [TopBottom](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/TopBottom.glsl): The outgoing image shrinks away upward while the incoming one slides in from the bottom (slide, zoom, vertical)
77
- - [VerticalClose](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/VerticalClose.glsl): The incoming image closes in from the left and right edges toward the middle (wipe, split)
78
- - [VerticalOpen](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/VerticalOpen.glsl): The incoming image opens from a line in the middle toward the left and right edges (wipe, split)
79
- - [WaterDrop](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/WaterDrop.glsl): Ripples spread from the center like a drop falling into water, crossfading to the incoming image (ripple, water, blend)
80
- - [ZoomInCircles](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/ZoomInCircles.glsl): Concentric rings of the outgoing image zoom at different speeds before revealing the incoming one (zoom, circle)
81
- - [ZoomLeftWipe](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/ZoomLeftWipe.glsl): Zooms into the outgoing image, then the incoming one wipes in from right to left (zoom, wipe, horizontal)
82
- - [ZoomRigthWipe](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/ZoomRigthWipe.glsl): Zooms into the outgoing image, then the incoming one wipes in from left to right (zoom, wipe, horizontal)
83
- - [angular](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/angular.glsl): A wipe that sweeps around the center from a starting angle (wipe, radial, clock)
84
- - [burn](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/burn.glsl): A crossfade that brightens toward a color in the middle (fade, color, flash)
85
- - [burn0](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/burn0.glsl): The outgoing image burns away in noisy, glowing patches (burn, fire, noise)
86
- - [cannabisleaf](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/cannabisleaf.glsl): A cannabis-leaf shape grows from the center to reveal the incoming image (shape, wipe)
87
- - [chessboard](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/chessboard.glsl): A chessboard pattern of squares reveals the incoming image (grid, squares, pattern)
88
- - [circle](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/circle.glsl): The outgoing image closes into a circle over a background color, then the incoming one opens from it (circle, iris, shape)
89
- - [circleopen](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/circleopen.glsl): A soft-edged circle opens from the center to reveal the incoming image (circle, iris, wipe)
90
- - [colorphase](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/colorphase.glsl): A crossfade in which each color channel changes at a different time (fade, color)
91
- - [coord-from-in](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/coord-from-in.glsl): A crossfade in which the colors of one image displace the other (displace, distort, blend)
92
- - [crosshatch](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/crosshatch.glsl): The incoming image appears through a crosshatch of lines spreading from the center (pattern, lines, noise)
93
- - [crosswarp](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/crosswarp.glsl): The outgoing image zooms in while the incoming one zooms out into place, sweeping from right to left (warp, zoom, horizontal)
94
- - [cube](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/cube.glsl): The two images are faces of a rotating 3D cube, with a floor reflection (3d, cube, rotate, reflection)
95
- - [directional-easing](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/directional-easing.glsl): Like Directional, with an eased movement (slide, push, directional)
96
- - [directionalwarp](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/directionalwarp.glsl): A diagonal wipe with a warped, smeared edge (wipe, warp, directional)
97
- - [directionalwipe](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/directionalwipe.glsl): A soft-edged diagonal wipe (wipe, directional)
98
- - [displacement](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/displacement.glsl): A crossfade in which a displacement map (an extra grayscale texture) warps both images (displace, distort, blend)
99
- - [dissolve](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/dissolve.glsl): The incoming image spreads over the outgoing one with a hot, glowing edge (dissolve, burn, glow)
100
- - [doorway](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/doorway.glsl): The outgoing image opens like double doors as the incoming one comes forward, with a floor reflection (doors, 3d, reflection)
101
- - [fade](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/fade.glsl): A linear crossfade between the two images (fade, blend)
102
- - [fadecolor](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/fadecolor.glsl): A fade through a solid color, black by default (fade, color)
103
- - [fadegrayscale](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/fadegrayscale.glsl): A crossfade through grayscale (fade, grayscale, color)
104
- - [flyeye](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/flyeye.glsl): The image breaks into a fly's-eye grid of lenses with color separation (lens, distort, chromatic)
105
- - [fragment](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/fragment.glsl): The outgoing image shatters into fragments that fly away (shatter, fragments)
106
- - [heart](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/heart.glsl): A heart shape grows from the center to reveal the incoming image (shape, wipe, heart)
107
- - [hexagonalize](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/hexagonalize.glsl): Both images turn into hexagons, crossfade, then sharpen again (pixelate, hexagon, blend)
108
- - [kaleidoscope](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/kaleidoscope.glsl): A crossfade through a spinning kaleidoscope (kaleidoscope, distort, blend)
109
- - [luma](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/luma.glsl): A wipe that follows the brightness of a grayscale mask (the luma texture) (wipe, luma, mask)
110
- - [luminance_melt](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/luminance_melt.glsl): The outgoing image melts away in noisy vertical streaks, depending on its brightness (melt, noise, luma)
111
- - [morph](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/morph.glsl): A crossfade in which each image is displaced by the other's colors, like a morph (morph, distort, blend)
112
- - [mosaic_transition](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/mosaic_transition.glsl): Both images break into mosaic blocks that blend, then sharpen into the incoming image (mosaic, pixelate, blend)
113
- - [multiply_blend](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/multiply_blend.glsl): A crossfade through the multiplied blend of both images (blend, fade)
114
- - [old_tv_lost_signal](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/old_tv_lost_signal.glsl): A crossfade with drifting tracking lines and tearing, like a TV losing its signal (retro, glitch, scanlines)
115
- - [parametric_glitch](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/parametric_glitch.glsl): A crossfade with glitchy horizontal bands and color shifts (glitch, blend)
116
- - [perlin](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/perlin.glsl): The incoming image appears through blobs of Perlin noise (noise, dissolve)
117
- - [pinwheel](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/pinwheel.glsl): A spinning pinwheel reveals the incoming image (pinwheel, radial, rotate)
118
- - [pixelize](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/pixelize.glsl): Both images pixelate, crossfade, then sharpen again (pixelate, blend)
119
- - [polar_function](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/polar_function.glsl): A flower shape with several petals grows to reveal the incoming image (shape, wipe, polar)
120
- - [powerKaleido](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/powerKaleido.glsl): The image folds into an animated kaleidoscope before revealing the incoming one (kaleidoscope, distort)
121
- - [randomNoisex](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/randomNoisex.glsl): The incoming image appears pixel by pixel in random noise (dissolve, noise)
122
- - [randomsquares](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/randomsquares.glsl): The incoming image appears in random squares (squares, grid, dissolve)
123
- - [ripple](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/ripple.glsl): Ripples spread from the center while crossfading (ripple, wave, blend)
124
- - [rotateTransition](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/rotateTransition.glsl): The images spin around the center while crossfading (rotate, spin, blend)
125
- - [rotate_scale_fade](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/rotate_scale_fade.glsl): The outgoing image spins and zooms while fading to the incoming one, over a background color (rotate, zoom, fade)
126
- - [scale-in](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/scale-in.glsl): The incoming image scales in from the center while fading in (zoom, fade)
127
- - [splitSlideInHorizontal](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/splitSlideInHorizontal.glsl): The incoming image slides in as two halves moving horizontally in opposite directions (slide, split, horizontal)
128
- - [splitSlideInOutHorizontal](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/splitSlideInOutHorizontal.glsl): The halves of both images slide horizontally in opposite directions, out and in at once (slide, split, horizontal)
129
- - [splitSlideInOutVertical](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/splitSlideInOutVertical.glsl): The halves of both images slide vertically in opposite directions, out and in at once (slide, split, vertical)
130
- - [splitSlideInVertical](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/splitSlideInVertical.glsl): The incoming image slides in as two halves moving vertically in opposite directions (slide, split, vertical)
131
- - [splitSlideOutHorizontal](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/splitSlideOutHorizontal.glsl): The outgoing image slides out as two halves moving horizontally in opposite directions (slide, split, horizontal)
132
- - [splitSlideOutVertical](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/splitSlideOutVertical.glsl): The outgoing image slides out as two halves moving vertically in opposite directions (slide, split, vertical)
133
- - [squareswire](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/squareswire.glsl): Squares grow along a diagonal sweep to reveal the incoming image (squares, grid, wipe, directional)
134
- - [squeeze](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/squeeze.glsl): The outgoing image is squeezed into a line with color separation, revealing the incoming one (squeeze, chromatic, vertical)
135
- - [static_wipe](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/static_wipe.glsl): A wipe from top to bottom with a band of TV static at its edge (wipe, static, noise, vertical)
136
- - [swap](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/swap.glsl): The two images swap places in 3D, with a floor reflection (3d, swap, reflection)
137
- - [tangentMotionBlur](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/tangentMotionBlur.glsl): The outgoing image is flung away along a curve with motion blur (motion-blur, rotate, slide)
138
- - [undulatingBurnOut](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/undulatingBurnOut.glsl): A circle with a wavy edge burns out from the center to reveal the incoming image (circle, burn, wipe)
139
- - [wind](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/wind.glsl): A ragged left-to-right wipe, as if the image was blown away by the wind (wipe, horizontal, noise)
140
- - [windowblinds](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/windowblinds.glsl): A crossfade through horizontal window blinds (blinds, stripes, blend)
141
- - [windowslice](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/windowslice.glsl): The incoming image appears through vertical slices that widen (slices, stripes, wipe)
142
- - [wipeDown](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/wipeDown.glsl): A hard-edged wipe from top to bottom (wipe, vertical)
143
- - [wipeLeft](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/wipeLeft.glsl): A hard-edged wipe from right to left (wipe, horizontal)
144
- - [wipeRight](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/wipeRight.glsl): A hard-edged wipe from left to right (wipe, horizontal)
145
- - [wipeUp](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/wipeUp.glsl): A hard-edged wipe from bottom to top (wipe, vertical)
146
- - [x_axis_translation](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/x_axis_translation.glsl): The outgoing image slides to the right, uncovering a crossfade to the incoming one (slide, horizontal, blend)
147
- - [zoomInOut](https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/transitions/zoomInOut.glsl): Zooms into the outgoing image until it blurs into a flat color, then out to the incoming one (zoom, blur)
23
+ - [AdvancedMosaic](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/AdvancedMosaic.glsl): Both images break into large blocks that blend, then sharpen into the incoming image (pixelate, mosaic, blend)
24
+ - [BlockDissolve](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/BlockDissolve.glsl): The incoming image appears in small random blocks (dissolve, blocks, noise)
25
+ - [BookFlip](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/BookFlip.glsl): The outgoing image turns like a book page from right to left, revealing the incoming one (page, flip, 3d)
26
+ - [Bounce](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Bounce.glsl): The outgoing image drops out of the frame with a few bounces, revealing the incoming one (bounce, slide, vertical, shadow)
27
+ - [BowTieHorizontal](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/BowTieHorizontal.glsl): Two triangles grow from the left and right edges into a bow tie that reveals the incoming image (wipe, shape, horizontal)
28
+ - [BowTieVertical](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/BowTieVertical.glsl): Two triangles grow from the top and bottom edges into a bow tie that reveals the incoming image (wipe, shape, vertical)
29
+ - [BowTieWithParameter](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/BowTieWithParameter.glsl): A bow-tie wipe with an adjustable shape that can run in reverse (wipe, shape)
30
+ - [Box](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Box.glsl): The outgoing image shrinks into a box, toward the center or a corner, revealing the incoming one (box, zoom, shape)
31
+ - [ButterflyWaveScrawler](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/ButterflyWaveScrawler.glsl): Wavy, color-separated ripples scramble the outgoing image into the incoming one (wave, distort, chromatic)
32
+ - [CircleCrop](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/CircleCrop.glsl): The outgoing image closes into a circle over a background color, then the incoming one opens from it (circle, iris, shape)
33
+ - [ColourDistance](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/ColourDistance.glsl): Pixels switch to the incoming image in order of how close their colors are (blend, color)
34
+ - [CrazyParametricFun](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/CrazyParametricFun.glsl): The outgoing image is pulled along a parametric curve into a psychedelic swirl (distort, psychedelic)
35
+ - [CrossZoom](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/CrossZoom.glsl): A crossfade through a strong zoom blur (zoom, blur, blend)
36
+ - [DefocusBlur](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/DefocusBlur.glsl): A crossfade through an out-of-focus blur (blur, blend)
37
+ - [Directional](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Directional.glsl): The incoming image pushes the outgoing one out in a given direction (slide, push, directional)
38
+ - [DirectionalScaled](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/DirectionalScaled.glsl): Like Directional, with both images scaled down while they slide (slide, push, zoom, directional)
39
+ - [DoomScreenTransition](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/DoomScreenTransition.glsl): The outgoing image melts down in uneven columns, like the Doom screen wipe (melt, columns, retro)
40
+ - [Dreamy](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Dreamy.glsl): A crossfade with a gentle wavy distortion (wave, blend)
41
+ - [DreamyZoom](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/DreamyZoom.glsl): Zooms and rotates into a bright flash, then out to the incoming image (zoom, rotate, flash)
42
+ - [Drop_Zone_Flicker](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Drop_Zone_Flicker.glsl): A flickering glitch with RGB offset, ghosting and scanlines that flashes back to the outgoing image (glitch, flicker, chromatic, scanlines)
43
+ - [EdgeTransition](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/EdgeTransition.glsl): Both images fade through black with their edges glowing (edges, fade)
44
+ - [FilmBurn](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/FilmBurn.glsl): Glowing film-burn light leaks wash over the image and reveal the incoming one (burn, film, light-leak)
45
+ - [Fold](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Fold.glsl): The incoming image unfolds from the left while the outgoing one folds away to the right (fold, slide, horizontal)
46
+ - [GlitchDisplace](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/GlitchDisplace.glsl): Blocks of the image are displaced in a glitch that flashes into the incoming image (glitch, displace)
47
+ - [GlitchMemories](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/GlitchMemories.glsl): A crossfade with glitchy, color-shifted blocks (glitch, chromatic, blend)
48
+ - [GridFlip](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/GridFlip.glsl): The image splits into a grid of tiles that flip one by one to the incoming image (grid, tiles, flip)
49
+ - [HSVfade](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/HSVfade.glsl): A crossfade through the HSV color space that cycles through hues (fade, color, hue)
50
+ - [HorizontalClose](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/HorizontalClose.glsl): The incoming image closes in from the top and bottom edges toward the middle (wipe, split)
51
+ - [HorizontalOpen](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/HorizontalOpen.glsl): The incoming image opens from a line in the middle toward the top and bottom edges (wipe, split)
52
+ - [InvertedPageCurl](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/InvertedPageCurl.glsl): The outgoing image curls away like a page, revealing the incoming one (page, curl, 3d)
53
+ - [LeftRight](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/LeftRight.glsl): The outgoing image shrinks away to the left while the incoming one slides in from the right (slide, zoom, horizontal)
54
+ - [LinearBlur](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/LinearBlur.glsl): A crossfade through a blur (blur, blend)
55
+ - [Mosaic](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Mosaic.glsl): The view pans across a mosaic of rotated tiles from both images and settles on the incoming one (mosaic, tiles, zoom)
56
+ - [Overexposure](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Overexposure.glsl): A crossfade through a washed-out, overexposed white (flash, light, fade)
57
+ - [PolkaDotsCurtain](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/PolkaDotsCurtain.glsl): The incoming image appears through growing polka dots (dots, pattern)
58
+ - [PuzzleRight](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/PuzzleRight.glsl): The image splits into a grid of tiles that flip one by one to the incoming image (grid, tiles, flip)
59
+ - [Radial](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Radial.glsl): A radial wipe that sweeps around the center like a clock hand (wipe, radial, clock)
60
+ - [Rectangle](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Rectangle.glsl): A rectangle grows from the center to cover the outgoing image, then shrinks to reveal the incoming one (box, shape, iris)
61
+ - [RectangleCrop](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/RectangleCrop.glsl): The outgoing image shrinks into a small rectangle over a background color, then the incoming one grows from it (box, iris, zoom)
62
+ - [Revolve_Left](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Revolve_Left.glsl): The outgoing image swirls and zooms with motion blur into the incoming one (swirl, zoom, rotate, blur)
63
+ - [Rolls](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Rolls.glsl): The outgoing image rolls away around a corner, revealing the incoming one (rotate, roll)
64
+ - [RotateScaleVanish](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/RotateScaleVanish.glsl): The outgoing image spins and shrinks away over the incoming one (rotate, zoom, spin)
65
+ - [SimpleFlip](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/SimpleFlip.glsl): The outgoing image flips around the vertical axis into the incoming one (flip, horizontal)
66
+ - [SimpleZoom](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/SimpleZoom.glsl): Zooms into the outgoing image, then fades to the incoming one (zoom, fade)
67
+ - [SimpleZoomOut](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/SimpleZoomOut.glsl): The incoming image zooms out into place while fading in (zoom, fade)
68
+ - [Slides](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Slides.glsl): The outgoing image slides out, or the incoming one slides in, toward an edge, a corner or the center (slide, directional)
69
+ - [StarWipe](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/StarWipe.glsl): A growing star reveals the incoming image (wipe, shape, star)
70
+ - [StaticFade](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/StaticFade.glsl): Cuts to the incoming image halfway, hidden behind a burst of TV static (static, noise, retro)
71
+ - [StereoViewer](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/StereoViewer.glsl): Both images shrink into rounded cards that swap, like a stereo viewer toy (cards, zoom, retro)
72
+ - [StripDatamoshGlitch](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/StripDatamoshGlitch.glsl): A datamosh glitch: torn strips, chroma shifts and scan noise drag the outgoing image into the incoming one (glitch, datamosh, chromatic)
73
+ - [Swirl](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/Swirl.glsl): Both images swirl around the center while crossfading (swirl, rotate, blend)
74
+ - [TVStatic](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/TVStatic.glsl): Cuts to full-screen TV static, then to the incoming image (static, noise, retro)
75
+ - [TilesWave](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/TilesWave.glsl): The incoming image is revealed tile by tile in a diagonal wave (tiles, wave, wipe)
76
+ - [TopBottom](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/TopBottom.glsl): The outgoing image shrinks away upward while the incoming one slides in from the bottom (slide, zoom, vertical)
77
+ - [VerticalClose](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/VerticalClose.glsl): The incoming image closes in from the left and right edges toward the middle (wipe, split)
78
+ - [VerticalOpen](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/VerticalOpen.glsl): The incoming image opens from a line in the middle toward the left and right edges (wipe, split)
79
+ - [WaterDrop](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/WaterDrop.glsl): Ripples spread from the center like a drop falling into water, crossfading to the incoming image (ripple, water, blend)
80
+ - [ZoomInCircles](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/ZoomInCircles.glsl): Concentric rings of the outgoing image zoom at different speeds before revealing the incoming one (zoom, circle)
81
+ - [ZoomLeftWipe](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/ZoomLeftWipe.glsl): Zooms into the outgoing image, then the incoming one wipes in from right to left (zoom, wipe, horizontal)
82
+ - [ZoomRigthWipe](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/ZoomRigthWipe.glsl): Zooms into the outgoing image, then the incoming one wipes in from left to right (zoom, wipe, horizontal)
83
+ - [angular](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/angular.glsl): A wipe that sweeps around the center from a starting angle (wipe, radial, clock)
84
+ - [burn](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/burn.glsl): A crossfade that brightens toward a color in the middle (fade, color, flash)
85
+ - [burn0](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/burn0.glsl): The outgoing image burns away in noisy, glowing patches (burn, fire, noise)
86
+ - [cannabisleaf](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/cannabisleaf.glsl): A cannabis-leaf shape grows from the center to reveal the incoming image (shape, wipe)
87
+ - [chessboard](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/chessboard.glsl): A chessboard pattern of squares reveals the incoming image (grid, squares, pattern)
88
+ - [circle](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/circle.glsl): The outgoing image closes into a circle over a background color, then the incoming one opens from it (circle, iris, shape)
89
+ - [circleopen](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/circleopen.glsl): A soft-edged circle opens from the center to reveal the incoming image (circle, iris, wipe)
90
+ - [colorphase](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/colorphase.glsl): A crossfade in which each color channel changes at a different time (fade, color)
91
+ - [coord-from-in](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/coord-from-in.glsl): A crossfade in which the colors of one image displace the other (displace, distort, blend)
92
+ - [crosshatch](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/crosshatch.glsl): The incoming image appears through a crosshatch of lines spreading from the center (pattern, lines, noise)
93
+ - [crosswarp](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/crosswarp.glsl): The outgoing image zooms in while the incoming one zooms out into place, sweeping from right to left (warp, zoom, horizontal)
94
+ - [cube](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/cube.glsl): The two images are faces of a rotating 3D cube, with a floor reflection (3d, cube, rotate, reflection)
95
+ - [directional-easing](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/directional-easing.glsl): Like Directional, with an eased movement (slide, push, directional)
96
+ - [directionalwarp](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/directionalwarp.glsl): A diagonal wipe with a warped, smeared edge (wipe, warp, directional)
97
+ - [directionalwipe](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/directionalwipe.glsl): A soft-edged diagonal wipe (wipe, directional)
98
+ - [displacement](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/displacement.glsl): A crossfade in which a displacement map (an extra grayscale texture) warps both images (displace, distort, blend)
99
+ - [dissolve](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/dissolve.glsl): The incoming image spreads over the outgoing one with a hot, glowing edge (dissolve, burn, glow)
100
+ - [doorway](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/doorway.glsl): The outgoing image opens like double doors as the incoming one comes forward, with a floor reflection (doors, 3d, reflection)
101
+ - [fade](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/fade.glsl): A linear crossfade between the two images (fade, blend)
102
+ - [fadecolor](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/fadecolor.glsl): A fade through a solid color, black by default (fade, color)
103
+ - [fadegrayscale](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/fadegrayscale.glsl): A crossfade through grayscale (fade, grayscale, color)
104
+ - [flyeye](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/flyeye.glsl): The image breaks into a fly's-eye grid of lenses with color separation (lens, distort, chromatic)
105
+ - [fragment](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/fragment.glsl): The outgoing image shatters into fragments that fly away (shatter, fragments)
106
+ - [heart](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/heart.glsl): A heart shape grows from the center to reveal the incoming image (shape, wipe, heart)
107
+ - [hexagonalize](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/hexagonalize.glsl): Both images turn into hexagons, crossfade, then sharpen again (pixelate, hexagon, blend)
108
+ - [kaleidoscope](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/kaleidoscope.glsl): A crossfade through a spinning kaleidoscope (kaleidoscope, distort, blend)
109
+ - [luma](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/luma.glsl): A wipe that follows the brightness of a grayscale mask (the luma texture) (wipe, luma, mask)
110
+ - [luminance_melt](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/luminance_melt.glsl): The outgoing image melts away in noisy vertical streaks, depending on its brightness (melt, noise, luma)
111
+ - [morph](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/morph.glsl): A crossfade in which each image is displaced by the other's colors, like a morph (morph, distort, blend)
112
+ - [mosaic_transition](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/mosaic_transition.glsl): Both images break into mosaic blocks that blend, then sharpen into the incoming image (mosaic, pixelate, blend)
113
+ - [multiply_blend](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/multiply_blend.glsl): A crossfade through the multiplied blend of both images (blend, fade)
114
+ - [old_tv_lost_signal](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/old_tv_lost_signal.glsl): A crossfade with drifting tracking lines and tearing, like a TV losing its signal (retro, glitch, scanlines)
115
+ - [parametric_glitch](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/parametric_glitch.glsl): A crossfade with glitchy horizontal bands and color shifts (glitch, blend)
116
+ - [perlin](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/perlin.glsl): The incoming image appears through blobs of Perlin noise (noise, dissolve)
117
+ - [pinwheel](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/pinwheel.glsl): A spinning pinwheel reveals the incoming image (pinwheel, radial, rotate)
118
+ - [pixelize](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/pixelize.glsl): Both images pixelate, crossfade, then sharpen again (pixelate, blend)
119
+ - [polar_function](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/polar_function.glsl): A flower shape with several petals grows to reveal the incoming image (shape, wipe, polar)
120
+ - [powerKaleido](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/powerKaleido.glsl): The image folds into an animated kaleidoscope before revealing the incoming one (kaleidoscope, distort)
121
+ - [randomNoisex](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/randomNoisex.glsl): The incoming image appears pixel by pixel in random noise (dissolve, noise)
122
+ - [randomsquares](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/randomsquares.glsl): The incoming image appears in random squares (squares, grid, dissolve)
123
+ - [ripple](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/ripple.glsl): Ripples spread from the center while crossfading (ripple, wave, blend)
124
+ - [rotateTransition](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/rotateTransition.glsl): The images spin around the center while crossfading (rotate, spin, blend)
125
+ - [rotate_scale_fade](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/rotate_scale_fade.glsl): The outgoing image spins and zooms while fading to the incoming one, over a background color (rotate, zoom, fade)
126
+ - [scale-in](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/scale-in.glsl): The incoming image scales in from the center while fading in (zoom, fade)
127
+ - [splitSlideInHorizontal](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/splitSlideInHorizontal.glsl): The incoming image slides in as two halves moving horizontally in opposite directions (slide, split, horizontal)
128
+ - [splitSlideInOutHorizontal](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/splitSlideInOutHorizontal.glsl): The halves of both images slide horizontally in opposite directions, out and in at once (slide, split, horizontal)
129
+ - [splitSlideInOutVertical](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/splitSlideInOutVertical.glsl): The halves of both images slide vertically in opposite directions, out and in at once (slide, split, vertical)
130
+ - [splitSlideInVertical](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/splitSlideInVertical.glsl): The incoming image slides in as two halves moving vertically in opposite directions (slide, split, vertical)
131
+ - [splitSlideOutHorizontal](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/splitSlideOutHorizontal.glsl): The outgoing image slides out as two halves moving horizontally in opposite directions (slide, split, horizontal)
132
+ - [splitSlideOutVertical](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/splitSlideOutVertical.glsl): The outgoing image slides out as two halves moving vertically in opposite directions (slide, split, vertical)
133
+ - [squareswire](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/squareswire.glsl): Squares grow along a diagonal sweep to reveal the incoming image (squares, grid, wipe, directional)
134
+ - [squeeze](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/squeeze.glsl): The outgoing image is squeezed into a line with color separation, revealing the incoming one (squeeze, chromatic, vertical)
135
+ - [static_wipe](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/static_wipe.glsl): A wipe from top to bottom with a band of TV static at its edge (wipe, static, noise, vertical)
136
+ - [swap](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/swap.glsl): The two images swap places in 3D, with a floor reflection (3d, swap, reflection)
137
+ - [tangentMotionBlur](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/tangentMotionBlur.glsl): The outgoing image is flung away along a curve with motion blur (motion-blur, rotate, slide)
138
+ - [undulatingBurnOut](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/undulatingBurnOut.glsl): A circle with a wavy edge burns out from the center to reveal the incoming image (circle, burn, wipe)
139
+ - [wind](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/wind.glsl): A ragged left-to-right wipe, as if the image was blown away by the wind (wipe, horizontal, noise)
140
+ - [windowblinds](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/windowblinds.glsl): A crossfade through horizontal window blinds (blinds, stripes, blend)
141
+ - [windowslice](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/windowslice.glsl): The incoming image appears through vertical slices that widen (slices, stripes, wipe)
142
+ - [wipeDown](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/wipeDown.glsl): A hard-edged wipe from top to bottom (wipe, vertical)
143
+ - [wipeLeft](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/wipeLeft.glsl): A hard-edged wipe from right to left (wipe, horizontal)
144
+ - [wipeRight](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/wipeRight.glsl): A hard-edged wipe from left to right (wipe, horizontal)
145
+ - [wipeUp](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/wipeUp.glsl): A hard-edged wipe from bottom to top (wipe, vertical)
146
+ - [x_axis_translation](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/x_axis_translation.glsl): The outgoing image slides to the right, uncovering a crossfade to the incoming one (slide, horizontal, blend)
147
+ - [zoomInOut](https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/transitions/zoomInOut.glsl): Zooms into the outgoing image until it blurs into a flat color, then out to the incoming one (zoom, blur)
148
148
 
149
149
  ## Optional
150
150
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gl-transitions",
3
- "version": "1.75.0",
3
+ "version": "1.76.0",
4
4
  "description": "The open collection of GL Transitions",
5
5
  "main": "index.js",
6
6
  "license": "MIT",
@@ -1,6 +1,6 @@
1
- # Catalog (gl-transitions@1.75.0)
1
+ # Catalog (gl-transitions@1.76.0)
2
2
 
3
- 125 transitions. Generated from gl-transitions.json; full details (parameter hints, authors, source links) in https://cdn.jsdelivr.net/npm/gl-transitions@1.75.0/llms-full.txt.
3
+ 125 transitions. Generated from gl-transitions.json; full details (parameter hints, authors, source links) in https://cdn.jsdelivr.net/npm/gl-transitions@1.76.0/llms-full.txt.
4
4
 
5
5
  ## By tag
6
6
 
@@ -0,0 +1,4 @@
1
+ // SkSL source of every transition that compiles, by transition name.
2
+ // Same content as the sksl/<name>.sksl files, for bundlers that cannot import them (React Native, …).
3
+ declare const sksl: { [name: string]: string };
4
+ export default sksl;