Pixel Sorting Online: How Thresholds, Sort Keys, and Direction Create Glitch Art
Pixel sorting keeps the source palette but changes where selected pixels sit, turning familiar detail into controlled streams and bands.
Pixel sorting can look like a digital melt, but it is not blur, paint, or generative fill. The effect measures pixels, selects parts of a row or column, and reorders those selected colors by a chosen value. Sharp peaks can become long streaks; a bright sky can collapse into smooth bands; saturated details can travel through an otherwise stable composition.
Pixlane Pixel Sort makes that process available in a focused browser tool with horizontal, vertical, and two-axis directions. It sits beside creative companions such as the Glitch Effect Generator, Dithering Tool, and Halftone Generator in the Pixlane developer tools collection.
What pixel sorting really changes
Start with one scan line: a row for horizontal sorting or a column for vertical sorting. Every pixel has a sortable property. Brightness uses a luma-weighted reading of red, green, and blue; hue follows the color angle; saturation measures color intensity; and the individual red, green, or blue channels can be used directly.
A mask then decides which pixels are eligible. Under the default brightness-range mode, a pixel qualifies when its luma falls between the low and high thresholds. Consecutive qualifying pixels form a run. Each run is sorted independently, while pixels outside the mask remain in place as anchors.
The mask chooses the movable intervals; the sort key decides the order inside each interval.
This is why Pixlane Pixel Sort can keep some silhouettes recognizable while stretching other areas across the frame. It does not find a mountain, face, or object. It only follows numeric pixel rules. If you need an explicit black-and-white region map first, compare Threshold Segmentation; if transitions themselves are the subject, inspect them with Edge Detection.
Read the controls as a pipeline
The current Pixlane Pixel Sort controls describe four separate decisions:
- Direction offers Horizontal (rows), Vertical (columns), and Both. Horizontal creates lateral streams, Vertical creates falling or rising columns, and Both applies the operation across both axes for a stronger cross-woven result.
- Sort key offers Brightness (luma), Hue, Saturation, Red channel, Green channel, and Blue channel. The key changes the order, not the eligibility mask.
- Mask mode offers Brightness range, Saturation threshold, Edge mask (Canny), and No mask (full). The first two use the shared 0–255 threshold controls; No mask makes the full line eligible.
- Sort order offers Ascending and Descending. Alternate every N rows ranges from 0 to 10: 0 leaves alternation off, while 1 flips the effective order on every other line.
Direction chooses the scan lines, the mask chooses the runs, and the key plus order arrange the pixels.
Treat these as stages instead of an all-purpose intensity control. A dramatic change in the sort key may remain subtle when the mask admits only tiny runs. A wide mask can dominate the image even when the key stays unchanged. For a broader study of how RGB, HSV, and other representations organize color, use Colorspace Convert or extract dominant swatches with Palette Extractor.
Thresholds decide where the glitch lives
The public defaults are low 40 and high 200 on a 0–255 scale. In brightness-range mode, very dark pixels below 40 and bright highlights above 200 stay outside the selected runs. Midtones between them can move. Widening that interval usually admits more pixels and creates longer streams; narrowing it produces shorter, more fragmented islands.
Get Pixlanemedia’s stories in your inbox
Join Medium for free to get updates from this writer.
Saturation-threshold mode applies the same numeric window to saturation rather than luma. This is useful when vivid color should travel while neutral gray areas stay calmer. The interface also lists Edge mask (Canny) and No mask (full); No mask deliberately makes the entire row or column eligible. Because the result depends on both content and continuity, compare one setting at a time rather than changing every control together.
Remember that a mask is not a sort key. You can select mid-brightness regions, then order their pixels by hue. You can select saturated regions, then order them by blue-channel value. That separation is the creative engine: eligibility decides *where* movement happens; the key decides *how* the selected colors line up.
Try Pixel Sort on Pixlane
Open Pixlane Pixel Sort and upload a PNG, JPG, or WebP image. Landscapes with a clear horizon, portraits with strong contrast, neon scenes, and graphics with large color fields are easy to read. Begin with the public defaults: Horizontal (rows), Brightness (luma), Brightness range, thresholds 40–200, Ascending, alternation 0, and PNG output.
Keep the source fixed and change one stage at a time so the cause of each visual difference stays clear.
First switch Ascending to Descending. Then return to Ascending and change only the direction. Next compare Brightness with Hue on the same mask. Finally, move one threshold slowly until the selected streams begin or end around a feature you care about. This sequence makes each control legible instead of turning the effect into trial-and-error noise.
Processing runs locally in the browser, with no signup or watermark. Export PNG when you want lossless edges or expect another editing step; choose JPG when a smaller photographic file is more useful. The wider Pixlane developer tools collection and the main Pixlane library provide the next step without forcing one effect to do every job.
Three practical starting recipes
These are starting points, not fixed presets. The same controls produce different structures on different images.
Use a recognizable anchor in the source, then stop before the ordering erases the composition you wanted to keep.
Horizontal melt. Choose Horizontal, Brightness, Brightness range, Ascending, and alternation 0. Start at 40–200, then raise the low threshold if shadows are stretching too aggressively. This is the clearest route to long horizon-like streams.
Vertical color rain. Choose Vertical, Hue, and Saturation threshold. Descending order can reverse the color progression. Adjust the threshold window until vivid signs, clothing, lights, or flowers move while neutral areas remain more stable.
Woven cross-sort. Choose Both, a color-channel or Hue key, and No mask. Set Alternate to 2 for directional rhythm. This can become destructive quickly, so compare it with the gentler Glitch Effect Generator when you want channel shifts, scanlines, or slice displacement instead of ordered pixel runs.
For a more discrete, print-like transformation, Dithering Tool reduces colors through patterned error distribution; ASCII Art Generator maps image density to characters. Those tools change representation in different ways and should not be described as pixel sorting.
Use the effect without losing the image
Pixel sorting is strongest when the source still supplies a readable structure. Keep a face outline, ridge, product edge, or large negative-space region as an anchor. Longer runs create smoother streams; fragmented runs preserve more local detail. Both-axis sorting and full-line masks are powerful, but they can erase spatial relationships fastest.
The operation is also lossy in a compositional sense. Although it reuses existing pixel colors, it changes their neighborhood and position. Do not expect to reconstruct the original from the sorted result alone. Save the source, export intermediate versions, and prefer PNG if the image will pass through multiple processing stages.
Start with Pixlane Pixel Sort, keep the default 40–200 range long enough to understand the source, and change direction, key, mask, or order one at a time. Continue with Threshold Segmentation when you need an explicit region map, Edge Detection when boundaries matter, or the broader Pixlane developer tools catalog when the next step is a different image operation. The main Pixlane library keeps those workflows private, browser-based, and easy to compare.
