Show newer

No. 2 on the Top Pens of 2023 is "3D Card Hover" from Gayane Gasparyan.
It's such a *surprising* hover effect involving such beautiful art it's impossible not to like.
codepen.io/gayane-gasparyan/pe

:sys_twitter: twitter.com/CodePen/status/174

RT Amit Sheen
▶️ Live stream!
I love the @CodePen challenges, but I haven't done one in a long time, so I'm going to do this week's challenge - Live!
And since this week's topic is 'CSS Mathematics', I'll try to do a weird idea I had for a while now, using a whole bunch of calcs and trig…

:sys_twitter: twitter.com/CodePen/status/174

No. 3 on the Top Pens of 2023 is "Glowy Hover Effect" by Ines.
Such a clever tactic to duplicate the DOM in a layer directly on top, make coloring adjustments, then mask it to only show a portion of it.
codepen.io/inescodes/pen/PoxMy

:sys_twitter: twitter.com/CodePen/status/174

RT jhey ▲🐻🎈
CSS Tip! 🤯
You can create a CSS-only version of this balance slider using a scroll animation on the underlying input[type=range] 🚀
::-webkit-slider-thumb {
view-timeline: --thumb inline;
}
Scroll animation driven by the slider thumb animates a number between the "min" and…
<div class="rsshub-quote">
Malay Vasa: Prototyped a balance slider today ✨
How do you like your coffee?
</div>
:sys_twitter: twitter.com/CodePen/status/174

RT Wakana Y.K.
Finally finished up that terrain generator I’d left hanging for two years ⛰️
It is now possible to download the generated geometry in OBJ format.
Demo : codepen.io/wakana-k/full/BabRo
..and Caldera type is here : codepen.io/wakana-k/full/JjvXJ
@CodePen

:sys_twitter: twitter.com/CodePen/status/174

RT Nicolas Jesenberger
Had to do these toggles in CSS 🫠
@CodePen: cdpn.io/mdomqGR
<div class="rsshub-quote">
Sebastiano Guerriero: To the young designers thinking a light on a button means skeuomorphism is back: we used to craft wooden UIs in 2013 😄
</div>
:sys_twitter: twitter.com/CodePen/status/174

RT Ksenia Kondrashova
In the meantime, six (!) of my works made it to the top 100 @CodePen Most Hearted demos of 2023 🤩
codepen.io/2023/popular
Let me show you those animations again
⬇️

:sys_twitter: twitter.com/CodePen/status/174

RT masahito art
Made a new browser game - control catblob to catch all the mouseblobs, but watch out for the dogblobs!
The level is randomly generated, and becomes progressively difficult as you complete a game.
@CodePen
codepen.io/Ma5a/full/ZEPeJmp

:sys_twitter: twitter.com/CodePen/status/174

RT NATALIΞ
Shoutout to myself for this CSS player piano I created 7 years ago after binging Westworld. Just needed a tiny update and it still works after all this time
codepen.io/NRo/full/PbXreE

:sys_twitter: twitter.com/CodePen/status/174

RT Ksenia Kondrashova
Here's a laptop model, optimised to 642KB and rendered with @threejs
It's all set to be animated
+ comes with a screen plane to map *any* texture on
+ some (@greensock ) timelines I created already
Live demo & source code: codepen.io/ksenia-k/full/gOEgy
Hosted on @CodePen

:sys_twitter: twitter.com/CodePen/status/174

RT Wakana Y.K.
Finally finished up that terrain generator I’d left hanging for two years ⛰️
It is now possible to download the generated geometry in OBJ format.
Demo : codepen.io/wakana-k/full/BabRo
..and Caldera type is here : codepen.io/wakana-k/full/JjvXJ
@CodePen

:sys_twitter: twitter.com/WakanaYK/status/17

RT Ksenia Kondrashova
In the meantime, six (!) of my works made it to the top 100 @CodePen Most Hearted demos of 2023 🤩
codepen.io/2023/popular
Let me show you those animations again
⬇️

:sys_twitter: twitter.com/uuuuuulala/status/

RT Nicolas Jesenberger
Had to do these toggles in CSS 🫠
@CodePen: cdpn.io/mdomqGR
<div class="rsshub-quote">
Sebastiano Guerriero: To the young designers thinking a light on a button means skeuomorphism is back: we used to craft wooden UIs in 2013 😄
</div>
:sys_twitter: twitter.com/njesenberger/statu

Show older
小森林

每个人都有属于自己的一片森林,也许我们从来不曾走过,但它一直在那里,总会在那里。迷失的人迷失了,相逢的人会再相逢。愿这里,成为属于你的小森林。