@RT Noah Liebman (@noleli)
It occurred to me that you can use the @greensock GSAP MotionPathPlugin’s `getPositionOnPath()` method to help draw a gradient along a path. It’s not just for animation anymore!
https://codepen.io/noleli/pen/qBogWqy
RT Jon Kantner
Animated Star Rating
https://codepen.io/jkantner/pen/BarvVNa
RT T. Afif @ CSS Challenges
💡 CSS Tip!
Create a Speech Bubble using a few lines of code
✅ One element
✅ No pseudo-element
✅ Only 3 properties
✅ Optimized with CSS variables
Demo:
#CSS
http://codepen.io/t_afif/full/eYMbrJN
https://twitter.com/ChallengesCss/status/1560221299527614465
RT Danielle Smith 🏳️⚧️ 🇿🇦
Feeling nostalgic?
https://codepen.io/danini-the-panini/pen/mdxqzoE
https://twitter.com/daninithepan1ni/status/1560289851102138370
RT Jennifer Daniel
Noto Emoj featured in the latest @CodePen Spark ⚡️
I love seeing how people are using Noto (Note to self: transfer my newsletter somewhere else so I can emebd it on my blog!!!)
Thanks for sharing! 🙏
Jennifer Daniel: We did it, fam!!!!! Our monochrome emoji font is here and FREE (🆓!) for all your (including but not limited to) printed matter 📖, eink reader 📟, tattoo 💪🖋️, coloring book 🖍️, engraving 🔡, laser cutting 🎨, word processing 📝, web dev 💻 needs🖤🤍
https://fonts.google.com/noto/specimen/Noto+Emoji
https://twitter.com/jenniferdaniel/status/1560271353369882624
RT GreenSock
Re 🏆 So here's the challenge!
Make a demo using matchMedia, share it on twitter and tag us @greensock
The MOST CREATIVE one wins a Club GreenSock subscription, with access to ALL our bonus plugins like ScrollSmoother & MorphSVG 🥳
Start here, go go go!
http://codepen.io/GreenSock/pen/vYRvVvY
RT Zoë | z-
This week's #CodePenChallenge I tried to make it a single regex expression using the capture group match expression `(?1)` but swap out `%` and `#` for different characters but couldn't quite figure it. So solved recursively.
https://codepen.io/z-/pen/rNdQYeg
RT Hyperplexed
Theme Picker in 1 minute with 1 line of js?!
#codepen:
See more on YT:
https://cdpn.io/VwXEXbW
https://www.youtube.com/c/Hyperplexed
RT Smashing Magazine 🇺🇦 🏳️🌈
Didn't know that. Actually, the San Francisco Typeface Does Ship as a Variable Font, so we can use it quite extensively. via @chriscoyier
CodePen demo:
https://codepen.io/chriscoyier/pen/RwMQYyQ
https://chriscoyier.net/2022/08/02/actually-the-san-francisco-typeface-does-ship-as-a-variable-font/
RT R0dzy 🇺🇦
One line solution for "Equal with Deletions"
#codepenchallenge #JavaScript
https://codepen.io/rodzyk/pen/jOzQLvr
RT Brett Schwickerath
Codepen Challenge!! Use specific characters as deletion flags mid-string. Should even support deletion of delete flags! 😁
@CodePen #codepenchallenge #JavaScript
http://codepen.io/schwiiiii/pen/oNqQvaX
RT AdirCode
Made a custom kind of tooltip for a client project, I’m not sure if it’s even considered a tooltip, even though functionally it’s the same, what do you think?
Here’s my @CodePen:
https://codepen.io/Adir-SL/pen/VwXGPmy
RT Johan Karlsson
🔳🔲 Binary Pattern on @CodePen:
You know the drill: click to generate a new random pattern!
Some bit fiddling with: AND, OR, XOR
#generative #creativecoding
https://codepen.io/DonKarlssonSan/full/jOzvvwy
https://twitter.com/DonKarlssonSan/status/1558775186966683648
RT T. Afif @ CSS Challenges
Demo:
#CSS
T. Afif @ CSS Challenges: 👌 CSS Tip!
Create a fancy pattern using a few gradients and CSS variables.
Demo:
More CSS patterns 👉
#CSS
http://codepen.io/t_afif/full/zYWJedQ
http://github.com/Afif13/CSS-Pattern
https://twitter.com/ChallengesCss/status/1558549916653338625
RT Jhey 🔨🐻✨
Yeah, CSS is pretty cool...
👉
http://codepen.io/jh3y/pen/eYMPmJW
RT Adam Kuhn
put a lil spin on an old pen toying with svg filters + animations (w/ some bonus image & mix-blend options peppered in) for some rather trippy effects that'll make your gpu weep
https://codepen.io/cobra_winfrey/full/ZExMPKG
https://twitter.com/cobra_winfrey/status/1559210534704128001
New week, new #CodePenChallenge!
August's coding challenge continues with a new prompt from @cassidoo's newsletter!
Thanks @storyblok for sponsoring!
https://codepen.io/challenges/2022/august/3
RT Dave 🧱
Coded up a small piece of UI this morning with our Web Components in @CodePen, all I needed was one script reference and one CSS import to our framework.
You can even try it for yourself, all our component doc pages come with an "Edit in CodePen" button
Manuel Matuzović: What I like about Web Components is that you have this modern, component-based, reactive approach, but you can use these components in a traditional environment “ordinary HTML documents” without any build step.*
* This may sound naive or obvious, but I'm no JS app pro. :)
Bot
Build, test, and discover front-end code 👩🏽💻
Joined Dec 2020
