Pixelate was done using Pyodide since i prefer writing code in Python, but an improved version is available here: https://civarchive.com/models/2003107?modelVersionId=2267300
Thanks LizArt9 for taking the time to rewrite it in pure JS!
V1.5
Added more options to select quantization method, kmeans and dithering and a slightly better interface using simpleCSS (plus, no more need to change the wheel url if it is hosted next to it)
V1
Since not everyone has access to either A1111/Forge or even Python and that compiling Pillow with libimagequant is a pain in the ass, here is a tool to apply the pixel method described in my previous article... directly in your browser!
Leveraging Pyodide, a python interpreter in WASM and a custom build Pillow wheel with libimagequant, you can directly pixelate any picture simply.
The tool is available directly as a static space in HF: https://huggingface.co/spaces/n-Arno/pixelate
If you want to modify and host it yourself, you can download the source as a zip file here but please note that you'll have to host it somewhere (both the html and whl files) and change "https://<your-server-url>" in the code to your correct url like "https://test.com/page"
How to use:
1) browse for a picture
2) click run (it may take a few seconds at start in order to init Pyodide)
3) click reload original before re-running if you want to change the options (or they will be applied to the current image, may be helpful to reduce step by step).
Options:
1) scale: resize down the picture by dividing the dimension by the scale
2) colors: how many colors in the target result
3) quantize color: leverage libimagequant or not
4) apply RGB555: reduce colors to 16bit
5) crop to SNES size: center crop the resize picture dimensions if they exceeed SNES screen size (256x224)
6) rescale post-process: resize back up by the same scale the resulting picture
Description
Comments (6)
TODO for V2, making it responsive to be able to use it on a phone screen 😅
Wow, It worked perfectly! I tried it on my site and it worked out of the box, other than changing url of course. I'm pretty sure those python wheels are black magic, so amazing job wrangling it to function! Can't wait to poke around at it.
great work, palletize is kind of annoying. would you mind adding dithering settings?
If you want to modify and host it yourself, you can download the source as a zip file here but please note that you'll have to host it somewhere (both the html and whl files) and change "https://<your-server-url>" in the code to your correct url like "https://test.com/page"
cant really find that in the code. you just load pyodite from cdn in the index.html, right? where do you load the custom wheel?
ah, never mind, I changed the code to load the wheel. Essentially
```
await pyodide.loadPackage("micropip");
const micropip = pyodide.pyimport("micropip");
await micropip.install("./pillow-10.2.0-cp312-cp312-pyodide_2024_0_wasm32.whl");
```
I got a version which preserves metadata. Happy to share it here, if possible?
@LizArt9 Yes, always happy for new contribution! Indeed, "./nyanyanya.whl" can work too, but micropip is sometimes a bit tricky with CORS, that's why i used the full url.
If you have your version up somewhere, i can look at the source, update mine and load it here as a V2 indeed :D (or a link to a repo with your code up :D)