@RT Chris Gannon
Claymorphic SVG button @CodePen
https://codepen.io/chrisgannon/pen/rNGqLmK
RT Louis Hoebregts
New week, new #CodePenChallenge! 🐶
For this demo, I exported a 3D model made of particles in an #SVG with 5000
<circle>
elements ✨
Each circle's colour and delay are defined with a simplex #noise algorithm (updated on each repeat) 🔁 @greensock
https://codepen.io/Mamboleoo/pen/mdBGydM
</circle>
https://twitter.com/Mamboleoo/status/1480965363902914560
RT Shaw
Fun @CodePen Trick: Turn syntax-highlighted code examples (even server-side rendered) into a dynamic CodePen embed on demand! Perfect for making documentation interactive without having dozens of embeds loading automatically.
RT Jon Kantner
Created a concept of a neumorphic Fitbit UI
https://codepen.io/jkantner/pen/poWxOVY
RT Christopher Kirk-Nielsen
Let's make some noise for this week's @CodePen #CodePenChallenge! I adapted my Houdini paint worklet to generate some noisy gradients on a regular canvas (and added random colours):
https://codepen.io/chriskirknielsen/pen/WNZamZR
RT Yannick
Just finished refining my pen for last week's #CodePenChallenge: random generative art 🎨.
It applies a random style to a chosen image using TensorFlow JS and TFLite. Props to the @Tensorflow team, it was super easy to get started 🚀🙌.
https://codepen.io/Coderesting/pen/YzrOOzp
RT Jhey 🔨🐻✨
OK. I definitely had too much fun putting this together for 10 minutes 😂 This is what it's all about 🙌
It has evolved slightly but I need to go to the gym 😅
Celine Dion is the "perfect" addition for adding this whimsical touch ✨
👉
Jhey 🔨🐻✨: 📢 JavaScript/Whimsy Tip! ✨
Do you know about the PageVisibility API? 🧐
Lean into browser APIs like this to give your sites and apps a little character 😎
This code would play audio when a user navigates away from your page 🚀 What else could we do?
Demo link below 🔗
RT CSS Challenges
🏆 CSS Challenge
This week #CodePenChallenge is about noise so here is a CSS-only noise effect!
Give your image an old-style looking with a few lines of code.
Demo:
#CSS
https://codepen.io/t_afif/pen/GRMYjYx
https://twitter.com/ChallengesCss/status/1480629718533746693
RT George Francis
Holy s*** there's some cool generative art floating around @CodePen at the moment! Here's a small handful of my favorites✨
"Summery Tiles" by @natszafraniec
"Vaporwave Sketchbook" by @cassiecodes
"Generative Gooey Flow Fields" by @cobra_winfrey
🔥 🔥 🔥
https://twitter.com/georgedoescode/status/1480556516491026433
RT Álvaro Montoro
A burning match in CSS and a single HTML element.
https://codepen.io/alvaromontoro/full/RwLYzeR
https://twitter.com/alvaro_montoro/status/1480520092979011592
RT Kaz
"GenErAtivE ArT HaS nO pUrPOsE"
My kitchen needs an urgent renovation with
Natalia's Generative Summery tiles😍I'd buy 'em any day.
https://codepen.io/natszafraniec/pen/dyVqZyE
RT Håvard
Did you know that you can create tooltips and pop-ups without Javascript? 💬
By using
<details>
,
<summary>
and a litte psuedo-element-magic you can simulate the opening and closing of a tooltip 🔥
Check out this demo on @CodePen :
https://codepen.io/havardob/pen/RwLYjJR
</summary>
</details> https://twitter.com/brynjulfs1/status/1480557039323688962
The generative art #CodePenChallenge continues 🎨
This week, let's make some noise! 📣
https://codepen.io/challenges/2022/january/2
RT Johan Karlsson
Something that really is one single curve: Drawing Machine on @CodePen
(I made it several weeks ago)
Click to generate a new random image!
Two spinning wheels controls the motion of an arm that holds the pen, the paper spins too.
#genuary #genuary2022
https://codepen.io/DonKarlssonSan/pen/dyVOxGQ
https://twitter.com/DonKarlssonSan/status/1479802129904721921
RT Cassie Evans
✍️ 'lil generative vaporwave sketch for this week's @CodePen challenge.
Making heavy use of some fun SVG textures and @greensock's handy random utility function.
https://codepen.io/cassie-codes/pen/vYerjmr
RT Jhey 🔨🐻✨
3D CSS Parallax Headshot! 😮
- Powered by custom properties 💪
- Built into a configurable @reactjs component 🧱
- Integrated with @tailwindcss layers
A sprinkle of
👉
http://jhey.af/
http://niall.af/
http://codepen.io/jh3y/pen/wvrxOPr
RT Ana Tudor 🐯
See me code a little thing for this week's #CodePenChallenge: uniform distribution of dots on a disc
Can you figure out how to do it properly, avoiding middle clustering before watching?
Live on @CodePen:
&
https://youtu.be/AvpbYzGS0dM
https://codepen.io/thebabydino/pen/NWazdyL
https://codepen.io/thebabydino/pen/ExwRZQj
RT Jhey 🔨🐻✨
Re Anyways, this has become quite the ramble 😅
I got into this with @chriscoyier recently for @CodePen radio ✨
I'll tweet that out properly over the weekend. It was an honor and well, you'd think I'd paid Chris for the intro 😂
https://blog.codepen.io/2021/12/29/348-with-jhey/
RT Johan Karlsson
#genuary 7 on @CodePen:
Sol LeWitt
Wall Drawing 118
I cheated and made the transparency proportional to the length of the line. 😇
#genuary2022 #creativecoding #generative ❤️
https://codepen.io/DonKarlssonSan/pen/abLjqYj
https://twitter.com/DonKarlssonSan/status/1479439504750616579
Bot
Build, test, and discover front-end code 👩🏽💻
Joined Dec 2020
