Show HN: 4K Desktop Wallpaper Generator
tanck.nl
tanck.nl
No two images are the same. You may need a few refreshes to get an interesting result.
Ideas for optimization: - use some kind of seed from a URL, so that people can share them. - How about multi-monitor setups?
The multi-monitor setup is something I struggled a bit. My two monitors are stacked vertically. So I use SVG images, render them in 2x4k height + 80px or so and cut the relevant parts out.
edit: here's a hacky way to do it, since you can't seed Math.random() in JavaScript; add this at the start of the "draw()" function.
const url = new URL(location.href);
const match = /#([0-9]+)$/.exec(url.hash);
if (match) {
var seed = parseInt(match[1]);
Math.random = function() {
var x = Math.sin(seed++) * 10000;
return x - Math.floor(x);
};
}
The main issue I see is that all the non-random numbers in the code would need to remain fixed. I love tweaking those to improve the results. The link you'd share would have to be something like /v1/hash, where 'v1' is a folder with the 'frozen' version of the algorithm.
I also think the results would be less random/erratic, and since the images this generates are only around 150 kilobytes, they are also easy to share :).
It really says something about the elegance of the image generation algorithm when the sharing code is about as long as the code to generate images. I was surprised when I first saw this draw() function, only a few lines long. Great job!
Though one question popped up in my mind while looking at this... Given the trend of ever increasing screen resolutions with no end in sight, why don't OSes support using vector images (svg, etc) as wallpapers?
I have no idea what this means.
That said, I do still wonder why none of the OSes that I use (Windows, MacOS, Android, iOS, accounting for pretty much 100% of the OSes regular people use) have support for it.
Might end up tweaking it to my tastes and a few other resolutions, like for my ultra wide.
How are you doing the color palettes? Is it fully random or using some kind of picker algorithm?
And that reminds me of xfishtank. I still use that sometimes for old school cool and also because it is pretty optimized (when it was written many X terminals shared a 10mbit coax) and great way to see if a remote X desktop session is still responsive.
(Needs a tip jar or something though.)
Love the minimalism in yours! Maybe I should also put a URL for generating a single image like /random
Thank you a lot for this :)
I wonder is the code public or just page source?
(Will have to check the page when not on mobile)
Please let me know if you create something nice with it.
Do note that Firefox’s privacy.resistFingerprinting can block you from reading canvas image data, giving you garbage instead, and the permission prompt is basically unnoticeable if the user isn’t actively looking for it.