@RT Johan Karlsson
🍁 Hello autumn! 🍁 on @CodePen:
Click to generate a new random pattern 😉
#creativecoding #generative
https://codepen.io/DonKarlssonSan/full/wvmVMEg
https://twitter.com/DonKarlssonSan/status/1564337085888299011
RT Meme Lord Eric Meyer
It’s #chromium:has(:has()) day! To celebrate in the nerdiest way possible, here’s a test I built exploring how :has() and :empty interact, with some wacky :not() stuff thrown in there for good measure.
https://codepen.io/meyerweb/pen/YzegYPM
RT AdirCode
Buttons with a “3D” perforated effect, I like to call them “inset” buttons, feels the right word for CSS. 😂
Here’s the @CodePen:
https://codepen.io/Adir-SL/pen/XWEGZMM
RT Ricardo Oliva Alonso
3D Player/Recorder - Designed by Guillaume Kurkdjian
Live @CodePen:
#html #css #javascript #cssart #3D #isometric #voxelart #music #toto #frontenddev
https://codepen.io/ricardoolivaalonso/full/PoRvRmM
RT jake albaugh
TIL theres a web API for barcode detection in images! it's experimental, but better than any libs i've seen. got a demo of the API over on @CodePen if you're interested.
http://codepen.io/jakealbaugh/pen/VwXOPwB
RT Manuel Matuzović
TIL that you can use the :scope pseudo class to select direct children of an element with .querySelectorAll().
TIL:
CodePen:
https://www.matuzo.at/til/
https://codepen.io/matuzo/pen/XWEGwWd?editors=1111
RT Yusuke Nakaya
息抜きに CSS で遊ぶ！どこかで見たことあるような、ノイジーな立方体の集合体。ちょっと重いよ。
Only CSS: Noisy Cube
@CodePen
#css #css3d #cssart
https://codepen.io/YusukeNakaya/pen/RwMmajM
RT Jhey 🔨🐻✨
Re But, how did I generate those "--lerp" values? The answer is @greensock 💪
It has an awesome utility for distributing values using easing curves which is exactly what I needed 🙌
I used that to build this demo that generates the code 🤓
👉
http://codepen.io/jh3y/pen/ExEJMoR
RT AdirCode
WOW! 😱
I reached a 1,000 followers, that’s amazing and an opportunity to thank all me followers.
So thank you 🙏
Here’s my obligatory @CodePen for marking the occasion:
https://codepen.io/Adir-SL/pen/PoRXdWd
RT merl 🌳
about a year ago i wanted to make a meme but none of the generators were to my liking so i made it on @CodePen lol. i've decided i don't have time to make it "perfect" so here it is 🤷
https://codepen.io/halvves/pen/mdBYBjV
RT Josh Collinsworth
Dev humor alignment chart
(From this CodePen:
https://codepen.io/collinsworth/pen/QWmPjOv
https://twitter.com/jjcollinsworth/status/1562462657692971009
RT Zoë | z-
I created an additional entry for #CodePenChallenge using RegEx, as I have done for the previous 3 weeks
(I included the code I used to generate the object for the RegEx which was mostly a copy and paste from my serious entry)
https://codepen.io/z-/pen/eYMXjLL?editors=0010
RT Jon Kantner
Triple Venn Diagram Dots
https://codepen.io/jkantner/pen/gOeEZWG
RT Amit Sheen
I really liked this month's @CodePen challenges, prompt from @cassidoo's newsletter, and it's the last week, so I thought I'd make this one a little more visual...
Live demo:
https://codepen.io/amit_sheen/full/abYMGdo
RT Brett Schwickerath
Codepen Challenge!! Starting from q on a normal "qwerty" keyboard grid, accept a string and output the path needed to spell that string.
✨Added support for SHIFT + horiz/vert toggle✨
@CodePen #JavaScript #codepenchallenge
https://codepen.io/schwiiiii/pen/wvmOmWW
RT 🐴 Frontend Horse
Check out this fun visualizer for the new Roboto Flex variable font.
@robdimarzo mapped properties to different corners in this awesome @CodePen.
This font is so versatile it puts 30 other fonts out of work.
https://twitter.com/FrontendHorse/status/1561350924970459136
Ready for your next #CodePenChallenge?
Our final prompt from @cassidoo's newsletter is out today!
Let's move around a QWERTY keyboard with a remote control 🕹
Thanks @sourcegraph for sponsoring!
https://codepen.io/challenges/2022/august/4
RT T. Afif @ CSS Challenges
💡 CSS Tip!
Build an expanding image panels with Zig-Zag edges
✅ Minimal HTML
✅ Works with any number of images
✅ Optimized with CSS variables
Demos via @CodePen
- Flexbox:
- Grid:
Full explanation 👉
http://codepen.io/t_afif/full/xxWBLQR
http://codepen.io/t_afif/full/wvmrbje
http://css-tricks.com/css-grid-and-custom-shapes-part-2
https://twitter.com/ChallengesCss/status/1561717663965093889
Bot
Build, test, and discover front-end code 👩🏽💻
Joined Dec 2020
