Mastering Pixel Sort: A Complete Guide

> The Short Answer

Pixel sorting reorders pixels in each row or column by brightness where they cross a threshold — sorted regions smear into long streaks while untouched areas stay sharp. You can run the algorithm directly in your browser using the free Pixel Sorting Online tool, or in the Yan mobile app for live GPU processing. 0–30% threshold sorts subtle dark streaks, 30–70% fits most photos, and 70–100% creates heavy distortion. High-contrast subjects deliver the most striking results.

What is Pixel Sorting?

Pixel sorting rearranges pixels based on brightness or color values. The algorithm scans rows (or columns), finds pixels that meet a threshold, and reorders them. The effect: images that look like they're melting.

You can experiment with this effect immediately in your browser using our free Pixel Sorting Online generator.

How the Pixel Sorting Algorithm Works

The core sorting operator processes image data in three sequential stages:

Luminance and contrast evaluation: Each pixel is converted into a luminance value adjusted by your contrast curve to determine sorting eligibility.
Contiguous run detection: The scanner walks along each row or column to find continuous stretches where luminance clears the chosen threshold.
In-place reordering: Qualified runs are sorted dark-to-bright and written back to the Canvas buffer. Runs are typically capped at 45% of the total line length to preserve recognisable subject silhouettes rather than collapsing the entire photo into a flat gradient.

Getting Started

Load your image in Yan or open the Pixel Sorting Online web tool
Select your direction: in the app, go to Effects > Pixel Sort; in the browser tool, horizontal and vertical Pixel Sort are pre-selected
Pick a direction (horizontal or vertical)
Adjust threshold (or Detail slider on the web) to control which pixels get sorted

Thresholds

The threshold sets the trigger point in the mobile app (note: in the browser tool, the Detail slider controls sorting coverage in the inverse direction, where lower detail yields thinner highlight streaks):

App Threshold	What sorts	Result
0–30%	Only dark pixels	Subtle streaks
30–70%	Mid-range and darker	Works for most images
70–100%	Almost everything	Heavy distortion

Tips

Layer effects. Pixel sort first, then add CRT scanlines or RGB shift.

Use high contrast images. Strong light/dark separation creates more dramatic results.

Direction matters. Vertical feels like rain or dripping. Horizontal feels like wind or speed.

Preview in the browser. Test threshold ranges in Pixel Sorting Online before applying complex multi-filter chains.

Good Subjects

Portraits: hair turns liquid
Cityscapes: buildings bleed into sky
Trees and foliage: cascade effect

Go Break Something

Crank the threshold. See what happens.

> Frequently Asked

What is pixel sorting?

Pixel sorting is an algorithmic glitch art technique that scans rows or columns of an image, identifies continuous intervals of pixels that cross a luminance threshold, and sorts them by brightness while leaving the remaining areas untouched. The contrast between smeared linear streaks and crisp original details creates the signature digital melt aesthetic.

How does the pixel sorting algorithm work?

The algorithm operates in three distinct passes: first, it converts pixels to luminance values based on contrast settings; second, it scans each row or column to find contiguous runs of pixels meeting the brightness threshold; third, it sorts each run from dark to bright and writes it back in place. Bounding run lengths prevents the entire image from flattening into a monotone gradient.

What are the best pixel sort tips for beginners?

Start with high-contrast images so the threshold creates clean boundaries between sorted smears and sharp subjects. Sort hair in portraits or skylines in cityscapes. Layer effects by pixel sorting first, then adding CRT scanlines or RGB shift on top. Try horizontal sorting for a windblown speed effect, and vertical sorting for a dripping, melting feel.

What does the pixel sort threshold actually control?

The threshold is the trigger point that decides which pixels get reordered. At 0–30% only dark pixels sort, producing subtle streaks. 30–70% is the middle ground that works for most images. At 70–100% almost every pixel sorts, which gives heavy distortion.

Should I sort horizontally or vertically?

Direction changes the metaphor, not the maths. Vertical sorting reads as rain or dripping paint; horizontal sorting reads as wind or speed. Pick the one that matches the motion you want the photo to imply.

Which photos work best for pixel sorting?

Images with strong light-to-dark separation. Portraits turn hair liquid, cityscapes let buildings bleed into the sky, and trees or foliage cascade. Flat, evenly lit images have too little contrast for the threshold to find an interesting boundary.

Can I pixel sort online in the browser without installing Yan?

Yes. You can use the free Pixel Sorting Online tool right in your browser. It runs client-side on Canvas 2D without uploading your image, supports horizontal and vertical brightness sorting with adjustable thresholds, and exports full-resolution PNGs up to 1400px. While the Yan mobile app features 36+ real-time GPU effects with multi-layering, the browser version gives you 28 texture filters completely free with zero installation.