CodePen.IO @[email protected]

RT Chris Gannon
Variable font Loader using GridLite @CodePen @greensock
Pen: https://codepen.io/chrisgannon/pen/BaqORmR
Font: https://v-fonts.com/fonts/gridlite https://t.co/ROR48NqvKo

https://twitter.com/ChrisGannon/status/1658486234443038720

RT Zoë | z-
Stacked cards that show on hover. A friend asked me how to do this effect so I whipped this up for them and I wasn't sure going into it but I quite like it.
https://codepen.io/z-/pen/eYPLWWL on @CodePen #CodePen #webdesign #css https://t.co/uM29TuUWrU

https://twitter.com/zed_dash/status/1658469586138972160

RT T. Afif @ CSS Challenges
💡 CSS Tip!
Add a fancy 3D effect to your image with a simple code
✅ No extra element (only the <img> tag)
✅ No pseudo-element
✅ No JavaScript
✅ Perfect 3D illusion on hover 🤩
Demo: http://codepen.io/t_afif/full/qBJyXNy via @CodePen
#CSS https://t.co/rrmeSU80ME

https://twitter.com/ChallengesCss/status/1658415005883154432

"Letter Cloud" by Khalil Galalem
https://codepen.io/khalil-galalem/pen/bGmvrer https://t.co/ixNtpaYBhZ

https://twitter.com/CodePen/status/1658494910373167105

"Pure CSS Gritty" by Adam Kuhn
https://codepen.io/cobra_winfrey/pen/qgEGMZ https://t.co/9DnMDD59xl

https://twitter.com/CodePen/status/1658284399387877377

RT Jordan Dey
I've created an instant photo film gallery!📸
Featuring a vanilla #javascript drag and drop functionality for desktop and mobile devices.
@CodePen: https://codepen.io/DeyJordan/pen/ExdpEYV
#photography #HTML #CSS #webdesign #frontend #CodePen #CodeInspiration #WebDevCommunity #CodeFun #CodeDemo https://t.co/fyOUYobjd6

https://twitter.com/DeyJordan/status/1658155798189551620

RT Konstantin Denerz
Just created generative art with #CSS ✨. Only a body-element with animated background.
📐 CSS cos() & sin()
🧙‍♂️ @property rule
✅ SCSS functions
✅ No JS
✅ 1 Element
🔗 https://codepen.io/konstantindenerz/pen/jOeKXmB via @CodePen
#animation #gm #geometry #generativeart #houdini https://t.co/151MsX3t65

https://twitter.com/kdenerz/status/1657360132064280577

The "Typography of Quotes" #CodePenChallenge continues!
This week, we're working with pull quotes 💻
https://codepen.io/challenges/2023/may/3 https://t.co/rSLvVVAE8U

https://twitter.com/CodePen/status/1658139380811169794

RT Nicolas Jesenberger
Skeuomorphic Toggle Switch in CSS (vol. 2) 🔵
@CodePen in next tweet ⬇️ https://t.co/UAk7MCNipA

https://twitter.com/njesenberger/status/1657045899573436417

RT ycw
155. 🕺@CodePen #gsap #threejs
https://codepen.io/ycw/full/xxyjdag https://t.co/Sqgv9O6xd7

https://twitter.com/ycwhk/status/1656404820063047682

"Animate CSS Grid with View Transitions" by @Bramus
https://codepen.io/bramus/pen/VwEXmqd
This View Transitions API stuff is big. It's cool on a single page using `document.startViewTransition` but it's going to be even better & easier on actual page transitions (⛳️'d in Chrome Canary) https://t.co/2teoHPa2yR

https://twitter.com/CodePen/status/1657103835989524481

RT Mustafa Enes
This is a hello world in what I call gravitational drawing. Hackable here @CodePen: https://codepen.io/pavlovsk/pen/NWOMwZR https://t.co/L7y8GuuMh0

https://twitter.com/scriptype/status/1656515986223243266

RT jhey 🔨🐻✨
Know what View Transitions are good for? 👀
Slide deck transitions! ⚡️
Transitions between slides are a cool use case for doing something between DOM states 🤓
This is a little peak at something I've been putting together ✨ (Rest is for Miami 😎)
@CodePen link below! 👇 https://t.co/OXJq7LKBl1

https://twitter.com/jh3yy/status/1656788994032582658

RT Genwaver
Here it is! A codepen of the last series. Feel free to play with the parameters and the code. I suggest you to mess around with the fragment shader to create different patterns. Have fun 💖
https://codepen.io/silmood/full/bGmKNoq
#threejs https://t.co/Vecvb7FfB2

https://twitter.com/genwaver/status/1656781207613460480

RT Jordan Dey
#CodePenChallenge inspired me to create another quotes work! Check out my latest creation featuring random quotes from Breaking Bad with a cool animation 🗣️
@CodePen: https://codepen.io/DeyJordan/pen/ExdLazx
#BreakingBad #HTML #CSS #animation #WebDesign #FrontEnd https://t.co/tbzFSR7zyF

https://twitter.com/DeyJordan/status/1656677547348987910

RT Jon Kantner
Hover/focus effects for icons with glass and color tiles
https://codepen.io/jkantner/pen/QWZrMeB @CodePen #CSS https://t.co/IEI8IBKX1s

https://twitter.com/jonkantner/status/1656467653978980354

RT Zoë | z-
Just hit 7'500 followers on #CodePen! I've always found perspective art interesting and made one with CSS to celebrate 🥳
https://codepen.io/z-/pen/QWZQPZJ on @CodePen #webdesign #CSS https://t.co/02ujaZDtIR

https://twitter.com/zed_dash/status/1656644999050567683

RT jhey 🔨🐻✨
CSS Tip ✨
Button shimmers are a cool use case for container queries 🤓
Shift an element side to side whilst spinning a gradient
Don't know the size? Use a query ⚡️
button{container-type: size;}
@ keyframes slide {to{
translate: calc(100cqw-100%) 0;
}}
@CodePen link below 👇 https://t.co/OUBqtRpO9D

https://twitter.com/jh3yy/status/1656423856276488192

RT Nicolas Jesenberger
Skeuomorphic Range Slider with CSS & JS 🎚️
@CodePen and details about how I made it below 🧵⬇️ https://t.co/I9NrldefzZ

https://twitter.com/njesenberger/status/1656328579314069509

"Animate CSS Grid with View Transitions" by @Bramus
https://codepen.io/bramus/pen/VwEXmqd
This View Transitions API stuff is big. It's cool on a single page using `document.startViewTransition` but it's going to be even better & easier on actual page transitions (⛳️'d in Chrome Canary) https://t.co/9zmZTH3KPw

https://twitter.com/CodePen/status/1656410311962898432