DEV Community

George Francis
George Francis

Posted on • Edited on

CodePen - Generative Soft Gradients [SVG]

I have been seeing these soft + colorful gradients around a lot recently and thought it would be cool to make some generative ones. They pair really nicely with the new "glassmorphism" trend!

Top comments (4)

Collapse
 
jamesrweb profile image
James Robb

Again, some awesome work dude, you’re really good at this kind of thing!

One question, I’ve never used the ~~ operator before, can you explain what you use that for perhaps?

Collapse
 
georgedoescode profile image
George Francis

Ah, thanks so much James!

For sure, ~~ is being used here in place of Math.floor() to remove the decimals from the number. It is a habit i got into as it is slightly faster and a bit more terse, but honestly it's probably not the best for readability!

I'm actually not sure why I added it there now, perhaps I was planning on stripping the decimals from the values to make the SVG markup a little nice when inspecting, but I didn't follow through in the rest of the pen :)

Collapse
 
jamesrweb profile image
James Robb

I see, curiously, and maybe you don't have the answer but: I assume ~ does one things and ~~ does another? Like ! and !! for example. Do you know what that difference is though?

Thread Thread
 
georgedoescode profile image
George Francis

Oof, that's about the limits of my knowledge I'm afraid. I know that you are correct in saying a single tilde does another thing, but I have no idea what!