Here's a roundup of what I made in August! ๐
A bit of a slower month with some other things going on, my birthday, and having some downtime to rest a bit! ๐
SCREAMING_SNAKE_CASE
Had this idea of an SVG animation for screaming snake case. The idea being a snake that's a lawyer screaming ๐
Wait for the snake to scream.
Party Eggo
I've enjoyed making various hybrid animations for Discord this month ๐ The process is a little lengthy. But, the animated SVG come out quite nice.
Party Bear
There's even merch(Shirts, stickers, hoodies, etc.) for this one! ๐
Loading Cubes
Some nice little loading cubes โ๏ธ
Jh3y x Eggo
Another Discord hybrid emoji ๐
Love Buttons
Want to try and focus more on some micro-interaction UI. Put together this little "Love" button on the stream โค๏ธ
DIY Animation Scrubber
Had this idea that you could create your own animation scrubber using CSS variables and animation-delay, and I was right! You can!
Move Things with CSS Book Promo
I'm writing an ebook and trying to release it this week ๐ฏ It's called "Move Things with CSS" and it's about CSS animations and transitions. Naturally, I had to make a CSS animated promo for it.
Color Search Engine with Unsplash && React
Revisited a demo to convert it to using Netlify's serverless functions. Search by keyword to find a color using the Unsplash image API.
LEGO Webcam Filter
For the CodePen challenge, I took the opportunity to combine Legra.js with p5.js to create this LEGO filter ๐
Check it out here: https://codepen.io/jh3y/pen/YzqZVBb
CSS Art Exploded View Demo
Using this Rilakkuma CSS Art to create an exploded view to show how layering is a useful technique for creating images with CSS.
HSL && Mix Blend Mode Duotone Wheel
Create those rad duotone filters with CSS mix-blend-mode.
That's that!
Wanna see more? Reach out and say "Hi!" on Twitter!
Top comments (4)
Hi Jhey,
You may want to consider reducing the number of codepens included in the post. Having so many cripples the browser. Cool demos as always.
Yeah, I've noticed this with the last two roundups ๐
A bit of a shame that this is the case. Thank you! ๐
Looks like the webcam filter pen was the culprit! I've commented that one out for now ๐
๐๐ The codepen script is async, so putting a decent number of pens in one post shouldnt grind it to a halt, but depending on what you do in a pen, you need to see if it plays nice in the aggregate I guess wrt resources. When I embed more than one codepen in an article, I just include the embed script once, on the first pen. The script is probably cached but it still requires a call each time. I don't know what Dev.to does behind the scenes. Something else to consider..