cleanEdge
a pixel art upscaling algorithm for clean rotations
mode:
rotation
scaling
upload image
(or drop/paste a file below!)
example images
1
2
3
4
5
6
angle
scale
toggle
(cleanEdge)
slopes
highest color
line width
download rotated
cleanEdge is a pixel art upscaling algorithm designed for rotating sprites. Its goal is to improve the jumbled pixels and broken lines and edges that result from basic nearest neighbor rotation.
The way this works is by upscaling the art in a way that prioritizes those lines and edges.
While cleanEdge is designed primarily for sprite rotations, I've taken care to ensure the results when scaling also look nice. You can switch between these two results at the top.
Click and drag or scroll on the frame to rotate/scale the image, or enter the values manually.
Tips: Hold Shift while scrolling to make fine adjustments. Use middle-click to pan the image in scaling mode. Ctrl+c and ctrl+v to copy and paste the image.
option descriptions:
This version of cleanEdge is in the form of a shader, you can find the source code here!
It's MIT licensed, feel free to use it for any of your projects :) (credit is appreciated! but not required)
And if you do use it, I'd love to see it! Feel free to ping me on twitter)
❤ - torcado
While cleanEdge is designed primarily for sprite rotations, I've taken care to ensure the results when scaling also look nice. You can switch between these two results at the top.
Click and drag or scroll on the frame to rotate/scale the image, or enter the values manually.
Tips: Hold Shift while scrolling to make fine adjustments. Use middle-click to pan the image in scaling mode. Ctrl+c and ctrl+v to copy and paste the image.
option descriptions:
- toggle: enables/disables the algorithm to compare results to basic nearest neighbor rotation/scaling.
-
highest color: the color used in overlap priority calculations. E.g. if highest color is pure white, brighter colors (those closer to white) will overlap darker colors when applicable.
If your art has outlines, matching this setting to that color usually provides better results. - line width: how far each pixel's color will spread into its neighbors, where applicable. A value of ≈ 0.707 will make slopes line up along the diagonal (effectively cancelling out the influence of highest color)
- slopes: in scale mode, toggles 2:1 grade slopes between pixels. If disabled, only 45 degree angles will be used. (this is always enabled in rotation mode)
This version of cleanEdge is in the form of a shader, you can find the source code here!
It's MIT licensed, feel free to use it for any of your projects :) (credit is appreciated! but not required)
And if you do use it, I'd love to see it! Feel free to ping me on twitter)
❤ - torcado