RT David Aerne
super experimental HSL picker on @CodePen
https://codepen.io/meodai/full/ExoeqyG
RT Yusuke Nakaya
PixiJS の filter で遊びました。GlitchFilter がお気に入り✨
PixiJS: Glitch Filter
@CodePen
#pixijs
https://codepen.io/YusukeNakaya/pen/Rwxeovy
RT Pawel Grzybek
The CSS currentColor is probably the most underused keyword ever. Instead of explicit declarations, you can reuse the color from the element on other properties.
MDN:
CodePen:
#css
https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#currentcolor_keyword
https://codepen.io/pawelgrzybek/pen/bGaxoBQ
RT Kenny Krosky
iOS style @metafizzyco Flickity theme
https://codepen.io/ispykenny/pen/bGaxWeQ
RT Craig Roblewsky
Made a new @CodePen demo using one of my favorite @greensock plugins - DrawSVG.
Video alt: the word challenge spelled out with animation using multiple overlapping colored lines to draw each letter.
https://codepen.io/PointC/pen/PoEBrQP
RT Noah Liebman
Re Alright, here’s a “plucky” little standing wave underline microinteraction @CodePen
https://codepen.io/noleli/full/abEaJLe
RT FrontEndDev
Animal photo gallery w/ a side of Fizz (cats) Buzz (dogs).
@CodePen #codepenchallenge
https://codepen.io/TheVVaFFle/full/BawpvRa
https://twitter.com/Th3FrontEndDev/status/1513942963604312074
RT Sophia Wood
Circle Hatching is featured in this weeks spark along with more p5js fun!
#generativeart #codepen #p5js
https://codepen.io/spark/281
RT 🇺🇦 Fabrizio Calderan
In case you need to print an empty stripboard for your #arduino projects or if you need to project some simple circuits for your prototypes, here is a simple tool for your convenience
https://codepen.io/fcalderan/full/qBqqNjq
RT Jhey 🔨🐻✨
⚡️ Speedy CSS Tip! ⚡️
Create a rad loading animation with CSS 🚀
Learn how to use CSS calc with inline custom properties and apply a stepped animation timing function 💪
Hope this is useful 🤞 Thank you for all the support and there are plenty of these in the pipeline 🙌
RT Ana Tudor 🐯🖤🌻
🆕 quick vid showing a very cool trick that comes in handy when coding slider thumbs
Live on @CodePen
Can you figure it out before checking code?
https://www.patreon.com/posts/video-reverse-on-65036752
https://codepen.io/thebabydino/pen/JjWXmdz
RT Elad Shechter
🤔The problem with the #CSS ':read-only' pseudo-class is that it will affect the ':disabled' element or any other "read-only" elements.
If you want to target only elements with the '[readonly]' attribute, then target this attribute directly.
@CodePen:
https://codepen.io/elad2412/pen/wvpmjGR
RT Amit Sheen
Flipping Squares
Inspired by @etiennejcb and made with #CSS
Full code at @CodePen:
https://codepen.io/amit_sheen/pen/RwxJxYQ
RT andrew
Another dribbble post I saw that I thought could be fun to try build (screenshot is the dribbble original). codepen is here:
https://codepen.io/andrewrock/full/WNdKoqr
It's week two of the April #CodePenChallenge!
Let's focus on the little details in a photo gallery 📸
Thanks @memberful for sponsoring!
https://codepen.io/challenges/2022/april/2
RT Louis Hoebregts
End of the week animation ✨🗺
Topographic map of a random region in France exported from Maperitive to SVG and animated in a #canvas using @p5xjs & @greensock ⚡
https://codepen.io/Mamboleoo/pen/KKZRvEp
RT Mark Boots 🇺🇦🌻
For this weeks @CodePen Challenge I created a generative memo board with a fun little animation
➡️
#codepenchallenge
https://codepen.io/MarkBoots/pen/JjMvKRg
RT Manz 🇮🇨⚡👾
The Office DVD ScreenSaver meme with Javascript
👀@CodePen
🎬Live making-of:
😼Repo
🐈GitHub
⚡More:
http://codepen.io/manz/pen/oNpqYER
https://youtu.be/PmAQdTdglCo
http://github.com/manzdev/twitch-dvd-screensaver
http://manzdev.github.io/twitch-dvd-screensaver
https://manz.dev/streams
RT Chris Nager
I had a great time chatting with @chriscoyier about accessibility and new CSS features.
Listen to our chat on @CodePen Radio.
https://blog.codepen.io/2022/04/06/362-chris-nager
RT @jh3yy: "Think outside the box ✨"
Pure CSS toggle created with the Houdini Properties and Values API 🚀
The joy of this approach is bei…
Build, test, and discover front-end code 👩🏽💻