@RT Adam Argyle
Re another demo!! here I'm letting CSS choose contrasting text over my swatch set, a classic design system presentation style that now I get to offload to the browser 😍
https://codepen.io/web-dot-dev/pen/qBpzwZW
RT Tanner Dolby
Pascal's triangle generator! This problem is a great example of Dynamic Programming as it uses the previous row to calculate cells of the current row.
@CodePen:
https://codepen.io/tannerdolby/full/JjpyGQp
RT Jon Kantner
A side navigation concept with animated expanding and collapsing
https://codepen.io/jkantner/pen/abqwjEz
RT AdirCode
A new @CodePen for all those Watchmen fans (comics, movie or TV show), here’s Dr. Manhattan’s clock symbol ticking with pure CSS:
https://codepen.io/Adir-SL/pen/vYdxvWM
It's the final week of the May #CodePenChallenge!
This week, let's fly ✈️
Thanks Swimm for sponsoring!
https://codepen.io/challenges/2022/May/4
RT Zoë | z-
Simple text alignment button set with shared highlighter.
https://codepen.io/z-/pen/XWZgZxx
RT Ryan Mulligan
Animating a counter? I discovered that @greensock's snap method can make it... in a snap! Here's a @CodePen example, topped off with some celebratory confetti 🎉
https://codepen.io/hexagoncircle/pen/xxYrpzP
https://twitter.com/hexagoncircle/status/1527715562956066817
RT T. Afif @ CSS Challenges
💡 CSS Tip!
Create a Zig-Zag underline with a cool hover effect using a few lines of code
✅ One element
✅ No pseudo-element
✅ Less than 10 declarations
✅ Optimized with CSS variables
Demo:
#CSS
http://codepen.io/t_afif/full/PoQpLZR
https://twitter.com/ChallengesCss/status/1526869262152892428
RT Jonny Snow
Well that escalated quickly. Noise/Vectors/Points and all.
https://codepen.io/therealJS/pen/ExQWoXE?editors=0010
RT Sophia Wood
I made something - metronome Meditation
comments are for your pleasure
#cpcchallenge #mathart #physics #p5js #cpcswing
https://codepen.io/fractalkitty/full/XWZpLPM
RT Rob DiMarzo
Giving Roboto Flex a test drive on @CodePen :) Move your cursor around to manipulate this variable font via JS-driven CSS variables along 8 different axes!
🆎
https://codepen.io/robdimarzo/pen/eYVpRXm
RT Louis Hoebregts
For a recent project I had to animate a long grid of cards. Here is a reduced demo of it on @CodePen ✨
As always, animations are powered by @greensock 💚
The demo is responsive and adapts for both mouse and touch devices! 📱
https://codepen.io/Mamboleoo/full/JjpEZEo
RT Kevin Levron
Particles cursor, another #threejs toys 🤓
#codepen #webgl #creativecoding
https://codepen.io/soju22/full/KKQaGrE
RT Tom Hinton
Ludicrously early but here’s my #WCCChallenge on the theme of "⬛#000000FF, ⬜#FFFFFFFF, 🟥#FF0000FF"
https://codepen.io/TomHinton/pen/oNEBYqY
RT Asyraf Hussin
Draw Lady in Blue using CSS
@CodePen :
https://codepen.io/AsyrafHussin/pen/zYvwemL
https://twitter.com/asyrafhussin4/status/1525766040923164672
RT ilithya
What started w/ a prompt in a pairing session w/ a buddy, sent me into a rabbit hole to understand more of the CanvasRenderingContext2D to create shadows & gradient colors within p5.js.
Click/tap to change the gradient colors or animation:
https://codepen.io/ilithya/full/RwQopgr
https://twitter.com/ilithya_rocks/status/1525578971290734594
RT Jhey 🔨🐻✨
"My money don't jiggle jiggle..." 🎶
CSS Tip? CSS aspect-ratio comes in clutch for sizing things where you want real-life proportions ⭐️
.💸 {
aspect-ratio: 6.14 / 2.61;
}
Whip that audio on! 📢 Few little tricks in this one 😁
👉
@CodePen
http://codepen.io/jh3y/pen/ExQZjyY
RT 小山最中
ランダムウォークする線で植物を書く。ツタの曲がりやすさ（一つ前の点と同じ方向への曲がりやすさ）が変わると植物全体の形も変わってくる。
#043 Vines
#creativecoding #generative #p5js
https://codepen.io/koyamamonaka/pen/wvygeBR
Bot
Build, test, and discover front-end code 👩🏽💻
Joined Dec 2020
