Twirly Swirly Colorful Noise Viewer

Choose Your (Looping) Implementation:

• TeaVM, JavaScript (should work everywhere; preferred)
• TeaVM, WASM (won't always work on mobile browsers)
• Google Web Toolkit (should work everywhere)

There's also the new Endless Mode, which won't loop and will change continually, just about forever. Endless, TeaVM, JavaScript (should work everywhere).

If you want real-time control, try Input Mode, which responds to mouse clicks or taps on a phone, and will change smoothly if you drag the mouse or your finger. Right-click or two-finger tap to change divisions! Input, TeaVM, JavaScript (should work everywhere).

Controls for all Looping implementations:

• 'h' decreases the hue rotation (with Shift, it increases the rotation). This can be held down, and wraps.
• 'g' decreases the 'g' parameter that affects color (with Shift, it increases 'g'). This can be held down. If this stops doing anything, it has hit its lower or upper limit; try it again with or without holding shift.
• 'b' decreases the 'b' parameter that affects color (with Shift, it increases 'b'). This can be held down. If this stops doing anything, it has hit its lower or upper limit; try it again with or without holding shift.
• 't' decreases the twistiness (with Shift, it increases twistiness). This can be held down. If this stops doing anything, it has hit its lower or upper limit; try it again with or without holding shift.
• 'd' decreases the number of divisions, or raises it if shift is held.
• 'r' decreases the rate of change, or raises it if shift is held.
• 's' moves the seed down by 1/1024, or up by 1/1024 if shift is held.
• '/' moves the seed down by 1/200, or up by 1/200 if shift is held.
• '1' forces the seed to 1, regardless of its prior value.
• 'a' changes the shader between one of seven (or more) alternate styles. Only some are rotationally symmetrical.
• 'o' starts the animation over, from its initial form (at time 0).
• 'f' prints the current frames per second (higher means better performance) to the log.
• 'c' writes to the clipboard and reloads the page with the address set to load the current state.
• On desktop only, Alt-Enter or Alt-F11 will toggle fullscreen mode.
• On desktop only, 'q' or 'Escape' will quit.

In Endless Mode, the 'h', 'g', and 'b' keys don't do anything, because they're constantly being adjusted. The 'a' key still switches between several different shaders. You can still change the time, seed and divisions. Copy and paste, via 'c' then copying/pasting the address, both work. Because changes to seed and division count are abrupt changes, they will restart the endless animation here, to allow showing the same starting point anyone else with the link will see.

In Input Mode, the 'g', and 'b' keys don't do anything, because they're controlled by click/touch position. The 'a' key still switches between several different shaders. You can still change the time, hue, seed and divisions. Copy and paste, via 'c' and copying/pasting the address, both work. Because changes to seed and division count are abrupt changes, they will restart the animation here, to allow showing the same starting point anyone else with the link will see.

For mobile users on any demo, you can change the seed by changing the first number after the `?` in the address bar. The rate can be changed by taking the last number before the underscore and zero at the end, which is usually like `0.0_0`, and change `0.0` to any value between -600 and 3000 (so, the end would look like `-600_0` or `3000_0`). -600 will freeze the animation, -300 will make it run at half speed, 300 will make it run 50% faster, 600 will make it run at double speed, and so on. There isn't a hard measurement for the rate, but 0 or 0.0 is a normal, somewhat slow speed, negative numbers are slower, and numbers over 200 or so are noticeably faster. The last `_0` indicates the shader to use. 0, 1, and 2 are all rotationally symmetrical, and treat the divisions as you would expect. Other shaders aren't symmetrical at all, and treat divisions like any other change to the seed. There are currently seven shaders, numbered 0 through 6. They all will handle endless mode by changing endlessly. They all will handle mouse/touch input in input mode.

Existing seeds may be broken or mean different things if they were linked with `c` and copying the address before May 16, 2026. Since that date, all seeds should mean about the same thing for the standard, input, and endless modes, but each mode handles changes after the start differently.