@RT Jhey 🔨🐻✨
What if your links had a little "sparkle"? ✨
Made with CSS, powered by custom properties 💪
👉
http://codepen.io/jh3y/pen/oNqdmbW
RT Ewald van Veen
Just before vacation kicks in I finished this weeks 'all unique characters' #CodePenChallenge. I created a little game where Mario has to crack Bowser's code in order to save his friends. 😎 Thanks again for this nice exercise @CodePen and @cassidoo!
https://codepen.io/ewaldvanveen/pen/wvmxppg
RT Rach Smith 🌈
loved listening to @jake_albaugh on @CodePen radio
https://blog.codepen.io/2022/08/10/380-ol-jake/
https://twitter.com/rachsmithtweets/status/1557453738411200513
RT T. Afif @ CSS Challenges
💡 CSS Tip!
Create a custom dashed border using a few lines of code.
✅ No extra element
✅ Less than 8 CSS properties
✅ Easy to update using CSS variables
Demo:
#CSS
http://codepen.io/t_afif/full/WNzKJgZ
https://twitter.com/ChallengesCss/status/1557330822801375232
RT Zoë | z-
Next one-liner for #CodePenChallenge creating a RegEx capturing group of any character and then seeing if that group appears again
https://codepen.io/z-/pen/jOzKzbP
RT Adrian Roselli 🗯
Re I wrapped this up in a brief post with samples:
Takeaways:
• `abbr` has no support;
• `<abbr>` also has not support;
• visually-hidden class with `aria-hidden` is your best bet today.
I put those examples into the CodePen so you can try them.
https://adrianroselli.com/2022/08/brief-note-on-calendar-tables.html
RT Brett Schwickerath
JS one-liner to test whether a string contains duplicate characters using the JS Set object.
@CodePen #codepenchallenge #JavaScript
https://codepen.io/schwiiiii/pen/PoRaQGR
RT Travis Vander Hoop
So, turns out there's no native 'dumpster fire' emoji, so I hacked one together. Here's hoping you never have to use it!
https://codepen.io/vanderhoop1/pen/JjLBYZv
https://twitter.com/YourFriendTrav/status/1557018986486714373
RT Maxime Malfilâtre
In the 3 dots loading animation, what does the middle one think about the others ?
I give you the answer with this pure css animation.
Thanks to @CodePen for highlighting my pen in its week's newsletter. It means a lot to me.
The pen :
https://codepen.io/maxew33/pen/MWVVaWE
RT Bence
Manifesting the 800th follower on @CodePen with this pen 🧘
btw the code fits in a tweet, see comment
https://codepen.io/finnhvman/pen/xxWzare
RT Chris 🆚 Browsers
Playing around with new image gallery thing on @CodePen.
https://codepen.io/onion2k/full/rNdvExw
RT Stas Melnikov
There are the display cheat sheet updates on @CodePen.
More details about changes of the width and height properties when using the flex, inline-flex, grid and inline-grid values
https://codepen.io/melnik909/full/LYyXreW
RT Adam Argyle
Re All 24 demos are collected in this @CodePen collection
- basic snapping
- advanced snapping
- snap tips
- snap tricks
https://codepen.io/collection/KpqBGW
RT Chris Coyier
Sir @alexquez and I just recently hit our "Have been running @CodePen for 10 years" milestone.
We teamed up to share our best bits of advice.
https://blog.codepen.io/2022/08/03/379-chris-alex-have-been-running-codepen-for-10-years-what-have-they-learned-heres-the-top-10/
It's week 2 of the August #CodePenChallenge!
This week, our prompt from @cassidoo's newsletter is:
"Write a function that determines if all the characters in a given string are unique"
Thanks @storyblok for sponsoring!
https://codepen.io/challenges/2022/August/2
RT Hyperplexed
Recreating the panning image gallery effect from
Link:
Tutorial:
#codepen
https://palette.supply/
https://cdpn.io/VwXXPKJ
https://youtu.be/GHZBa_R93ag
RT T. Afif @ CSS Challenges
💡 CSS Tip!
Create a grid of images with funny shapes and unexpected hover effect
✅ Minimal HTML code
✅ Less than 20 CSS declaration
✅ Optimized with CSS variables
Demo:
#CSS
http://codepen.io/t_afif/full/gOezMrY
https://twitter.com/ChallengesCss/status/1555515542072705024
RT Chris Coyier
I'm a little obsessed with the idea of previous sibling selectors.
https://codepen.io/chriscoyier/pen/qBoogaX
RT 🐴 Frontend Horse
I feel like this Three.js @CodePen by Kraut GTI would make for an awesome screen-saver. It's so satisfying seeing the marbles light up their little area.
Check it out:
https://codepen.io/krautgti/pen/vYReorP
https://twitter.com/FrontendHorse/status/1555158640612589568
Bot
Build, test, and discover front-end code 👩🏽💻
Joined Dec 2020
