@RT Dylan Beattie
Just watched @eladsc give one of the most astonishing talks I've ever seen at #FullStackX, about building an interactive playable game, with animation, scores, even a help screen, using only HTML and CSS. No JavaScript. The code is all here – check it out:
https://codepen.io/elad2412/pen/wvabjXy
RT Devin Pacholik
Took a @CodePen challenge to make a project about marbles. Borrowed some code I made from a recent matter.js project to make the Marble Mover game and focused on honing responsive UI with CSS. Super fun! #codepenchallenge #cpcmarbles
https://codepen.io/Devinp/full/oNqeMRd
RT T. Afif @ CSS Challenges
💡 CSS Tip!
Create a CSS-only "Back To Top" button with a simple code
✅ 0 JavaScript
✅ Control when the button appears
✅ Smooth scroll on click
✅ Powered by CSS grid and sticky position
Demo:
Full explanation 👉
http://codepen.io/t_afif/full/poLWLJG
http://www.freecodecamp.org/news/css-only-back-to-top-button/
https://twitter.com/ChallengesCss/status/1552253981396799488
RT Jhey 🔨🐻✨
Cascading CSS Text Effects! ✨
– Animate/transition on scroll 📜
– Powered by CSS custom properties 💪
Kinda dig the "Expanding" one, how about you? 🤓
👉
http://codepen.io/jh3y/pen/gOeGmRN
RT Álvaro Montoro
In this video, I show how to create a cute kawaii face that can be placed on almost any object or cartoon to make it look cuter... and it can be as simple as adding 3 radial gradients (eyes and mouth).
Demo and source code:
https://www.youtube.com/watch?v=q2a-EAmGbzA
https://codepen.io/alvaromontoro/full/RwMLLga
https://twitter.com/alvaro_montoro/status/1552208855458775041
RT ana 🧋
#CodePenChallenge | Glass Marbles 🟣
Finally finished my very first @CodePen challenge submission whoop whoop
https://codepen.io/praxeds/pen/yLKzVBp
RT Bramus
Dug into Motion One’s `scroll` today and must say it’s pretty easy to use (knowing I already have ScrollTimeline experience).
In under 2 hours I converted all my Scroll-Linked Animation demos into Motion One versions.
Check out the collection on @CodePen
Matt Perry: 🚀 Introducing Scroll, Motion One's new scroll-linked animations API!
This mighty 2.5kb function can link Motion One's animate() and timeline() animations to page scroll. Or use a callback to animate canvas, 3D, or anything you can imagine.
Get started:
http://motion.dev/dom/scroll
RT Maxime Malfilâtre
This morning, as I was drinking coffee while reading my emails, I saw the codepen newsletter, I opened it and here was one of my pens highlighted.
Thanks @CodePen, I am so proud that I was chosen. Impostor syndrome : 0, maxew : 1 😃.
The pen :
https://codepen.io/maxew33/pen/yLMzgZe
RT Lee Martin
Finally got to see @NopeMovie and you know I loved all those JAWS nods. Here's the little @CodePen hack I put together for the "☁️" #NopeMovie 🏇🏿🛸🤠🎥🙅🏿♂️🪙🔑🩸🏍🙈🌵🎈
Lee Martin: I was inspired to recreate the ominous cloud and trailing car dealership flag string from @JordanPeele's new film dropping this week, #NopeMovie, as an interactive 2D physics powered visual on @CodePen. ☁️🛸🐎 @nopemovie @monkeypaw
RT Jon Kantner
Made a #CSS (partial SVG) replica of a Dribbble shot, which is a very stretchy cup of coffee. ☕️
⚠️ Works in non-WebKit browsers only since Safari doesn’t support animating `d`.
https://codepen.io/jkantner/pen/Yzaxqzy
RT jake albaugh
Re animating 1k random rectangles with the same packing strategy on @CodePen if you're interested in having fun with it in that context.
https://codepen.io/jakealbaugh/pen/mdxwqag
RT Chris 🆚 Browsers
I had a go at recreating about 1s out of my all time favourite PC demo using CSS.. it kind of works.
My codepen:
The demo I'm using as inspiration:
I'm going to recreate it all eventually. Maybe.
https://codepen.io/onion2k/pen/ExEXmPY
https://www.youtube.com/watch?v=-ZxPhDC-r3w
RT Dave Rupert
📝 New post: Solving "The Dangler" Conundrum with Container Queries and :has()
https://daverupert.com/2022/07/solving-the-dangler-conundrum-with-has-and-container-queries/
It's the final week of the July #CodePenChallenge!
This week, we're playing with marbles 🔵🔴🟠🟢
Thanks @sourcegraph for sponsoring!
https://codepen.io/challenges/2022/july/4
RT Dario Corsi
It's been a while since I made something fun with code. Here's an ice pop loader built with just #CSS on @CodePen.
https://codepen.io/dariocorsi/pen/PoRpZPp
RT Asyraf Hussin
Draw Woman With Long Earrings using CSS
@CodePen :
https://codepen.io/AsyrafHussin/pen/wvmeGJj
https://twitter.com/asyrafhussin4/status/1550396813177368576
RT Abdullah Türkmen
#codepen playing cards challange is done!
@CodePen
https://codepen.io/abdullahturkmen/full/NWYjzZZ
https://twitter.com/muhendizolcam/status/1550365775818592256
RT Kaz | Artveloper | Web3
Click on the artwork to generate more Celestial Puddles | Generative Art
https://codepen.io/Sanja_kaz/pen/vYRGwqy
RT Tomoya Okada 🐈⬛
うにょんっ - Three.js
シェーダーって本当にすごいな〜....
#threejs #gsap
https://codepen.io/tomoya0815/pen/bGvWYze
Bot
Build, test, and discover front-end code 👩🏽💻
Joined Dec 2020
