RT Steph🛸
Made a little Codepen showing how to animate an SVG with pure CSS 💫 https://codepen.io/stephsstar/full/ExOjwLw https://t.co/LjE0hpy57l
RT Una 🇺🇦
🚨 ATTN: Subgrid is rolling out in Canary 🚨
Try it out with the #experimental-web-platform-features flag 🏁
And report any bugs you find @ http://bugs.chromium.org or here (CC @bfgeek)!
FYI - known issue: baselines do not work yet
Demo by @argyleink http://codepen.io/argyleink/pen/gOKXKYQ https://t.co/GH2loH8Wjr
RT Chris Gannon
Soft Dial @CodePen https://codepen.io/chrisgannon/pen/yLQyeEy @greensock #promorphism #javascript #interactive https://t.co/svtr9S6nTN
The Choice UI #CodePenChallenge continues!
This week, let's slide on over to range sliders 🎚
https://codepen.io/challenges/2023/june/2 https://t.co/GRAQUZnWDF
"Remaining reading time on scroll (CSS scroll animations)" by Fabrizio Calderan
https://codepen.io/fcalderan/pen/JjNKoLP https://t.co/dpaiyYmayP
RT Amit Sheen @CSSDAY 🇳🇱
Can't believe I haven't animated this logo 'til now... 😃
#CSSDay @CSSDayConf
Live demo on @CodePen: https://codepen.io/amit_sheen/full/KKrwvaE
Amazing logo design by @stephenhay https://t.co/bVxmTpVmKQ
RT Taha Shashtari
Creating animations in CSS and JS is so addictive 😍.
I've been playing this toggle animation in my head for the past couple of days, and I'm excited to say that I've finally created it.
@CodePen: https://codepen.io/tahazsh/pen/VwVYNLK
#CodePenChallenge https://t.co/spZ1UHGPgP
RT Chris Smith
New post: Prototyping in CodePen
https://chrissmith.xyz/blog/prototyping-in-codepen/
How I use CodePen to create new real HTML, CSS and JavaScript working prototypes.
@CodePen #HTML #CSS #JavaScript
RT Cassidy
I made a fun little Pen on @CodePen for the first time in a while!
https://codepen.io/cassidoo/pen/QWJwgox
RT T. Afif @ CSS Challenges
Another toggle for this week #CodePenChallenge
Click to travel into the subatomic universe! 🚀
Demo: http://codepen.io/t_afif/full/gOQONbr via @CodePen
⚠️ Only Chrome supports quantum physics. Don't try another browser, It won't work.
#CSS https://t.co/TP3aoECyEK
<div class="rsshub-quote">
T. Afif @ CSS Challenges: A checkbox pattern? why not! #CodePenChallenge
Your customer cannot miss it! They are obliged to click 😈
Demo: http://codepen.io/t_afif/full/gOQORrg via @CodePen
#CSS https://t.co/3JP4vBAJ0G
</div> https://twitter.com/ChallengesCss/status/1666567879943135235
RT Jordan Dey
This week's #CodePenChallenge is all about "Toggles"! 🕹️
I'm excited to share my submission called "Bubble Toggles", a cute and animated input design. 🫧
@CodePen: https://codepen.io/DeyJordan/pen/poQvgaz
#WebDevelopment #FrontEnd #Design #HTML #CSS #JavaScript #100DaysOfCode #CodePen #web #dev https://t.co/XXBZxDlEdi
RT Ksenia Kondrashova
This glass configurator has no custom shaders or geometries. Just MeshPhysicalMaterial and a bunch of standard geometries with rendering order set manually. Not 100% realistic but super simple
Live demo & source code: https://codepen.io/ksenia-k/full/YzYRPwb
Made with @threejs
Hosted on @CodePen https://t.co/1GDQBFRYDd
RT Jon Kantner
#CSS Apple Pro Display XDR
https://codepen.io/jkantner/pen/RwqwXXe @CodePen https://t.co/5WIcR9h2Hy
RT T. Afif @ CSS Challenges
A checkbox pattern? why not! #CodePenChallenge
Your customer cannot miss it! They are obliged to click 😈
Demo: http://codepen.io/t_afif/full/gOQORrg via @CodePen
#CSS https://twitter.com/ChallengesCss/status/1666197056023584789 https://t.co/3JP4vBAJ0G
<div class="rsshub-quote">
T. Afif @ CSS Challenges: A crazy CSS-only checkbox for this week #CodePenChallenge
The best way to make your customer mad 🤬
Demo: http://codepen.io/t_afif/full/dyQyvxq via @CodePen
#CSS https://twitter.com/CodePen/status/1665738888676093952 https://t.co/B4MfSeeiWl
</div> https://twitter.com/ChallengesCss/status/1666391861878042629
RT Bence
Plasma Globe 🔮 (507 bytes) #PetitePatterns on @CodePen
https://codepen.io/finnhvman/pen/bGQGOBQ?editors=1010 https://t.co/wt44ft9OjG
RT Steph🛸
Made a (purely decorative) toggle for this week's @CodePen challenge! Was nice to write in SASS again 🥰 https://t.co/mewI9rgDS6
RT Adam Argyle @ CSS Day
forked and linked it to scroll / it's presence in the viewport 🤓
```#css
@keyframes morph {
to {
font-variation-settings: "MORF" 60;
}
}
h1 {
animation: morph linear;
animation-timeline: view();
}
```
https://codepen.io/argyleink/pen/qBQByGN https://t.co/Tij3ZYohfI
<div class="rsshub-quote">
Adam Argyle @ CSS Day: KEEP
#CSS
WEIRD
https://codepen.io/argyleink/pen/KKGOpMZ https://t.co/pOWxiYq7V3
</div> https://twitter.com/argyleink/status/1666426144571248642
RT Håvard
So excited for @CSSDayConf tomorrow! 🙌
Here's a @CodePen displaying an animated version of their logo (could do with some better easing and order of appearance, but I've got a plane to catch🙃)
https://codepen.io/havardob/pen/xxQxpNP
RT T. Afif @ CSS Challenges
A crazy CSS-only checkbox for this week #CodePenChallenge
The best way to make your customer mad 🤬
Demo: http://codepen.io/t_afif/full/dyQyvxq via @CodePen
#CSS https://twitter.com/CodePen/status/1665738888676093952 https://t.co/B4MfSeeiWl
<div class="rsshub-quote">
CodePen.IO: The June #CodePenChallenge starts now!
This month is all about Choice UI — the elements that help people make choices 🔘
Let's kick it off with toggles!
https://codepen.io/challenges/2023/june/1 https://t.co/VDkdS66wOs
</div> https://twitter.com/ChallengesCss/status/1666197056023584789
Build, test, and discover front-end code 👩🏽💻