yayyy scnd logg

css

@Lumethra forced me

its basically a grid…

The body is the main grid container, and each element gets assigned to a specific area:

• the canvas takes the top row
• the slider, color picker, and toggle go in the middle row
• the palette sits in the bottom row

hope your happy now (scnd image is the answer)
good evening

the one and only?

idk if i am calling this project finished already…but its kinda done…js looks ugly

it started as like a canvas experiment ts, i basically wanted a pixelart playground or whatever…and then i asked myself…why not let it generate a galaxy like shapeee…
and how i did it was drawing a simple grid, generating an even simpler spiral and every point that was in a gridcell decides that this cell is getting colored…easy right?
yup…

color palette

for the coloring, had a little fun there bc i found a SUPERRR interesing video (https://www.youtube.com/watch?v=gnUYoQ1pwes)
and i wanted to kinda let the palette generate from one base color…so i made like hex to hsl conversion with the given color so i could adjust the hue and created several colors from that base hue:
background: a dark, muted versiondust: a darker, desaturated tonenebula: a medium, vivid tonecore: a brighter, lighter highlightstars: a very light near-white toneglow: a brighter accent color, which is not random, but a nice always fiting palette…

the actual coloring

so i used a simple (copied) noise script to decide where which color needs to go, and then for each weight (or height) of each pixel of the noise it chose one of the set colors….

funsies

for funsies one can look at the noise…bc why not

final words

this project ig is more about play, having fun with overcomplicated ways of doing shit and less about polishing a great ui…

have a nice day <3