Show newer

RT Trung Vo
A cool blur effect when hovering on a table row using purely CSS text-shadow 😆
See the code ➡️
Table is still a fundamental piece when we want to represent tabular data such as financial data, a calendar, the nutrition facts information panel, etc.
codepen.io/trungk18/pen/OJRepG

:sys_twitter: twitter.com/tuantrungvo/status

RT dumpsterfirepatty
I’ve missed CSS and I love my living room setup, so I combined both and made my living room with a single DIV and pure CSS
(p.s. if anyone has tips on caring for Birds of Paradise pls halp 😭)
codepen.io/pbmasigla/pen/poEmP

:sys_twitter: twitter.com/PATatohead/status/

It's the final week of the January !
To wrap up the States of Matter Challenge, our host @rosieebob has us experimenting with the plasma state of matter ☀️
codepen.io/challenges/2021/jan

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

RT Bramus!
✨ New scroll-animations demo: A (contact) list where items that come into view fly-in.
Comes in two flavors:
- JavaScript Web Animations API (WAAPI) + ScrollTimeline:
- CSS-only with @​scroll-timeline:
codepen.io/bramus/full/ExgJPjM
codepen.io/bramus/full/bGwJVzg

:sys_twitter: twitter.com/bramus/status/1352

RT ilithya
2_LiveCodingSession ✨
First stream of the yr with @iamelizasj in our Twitch Channel ☺️
I love this spontaneous pattern we came up with. It was wonderful to code & chat with some of you who were there 🖤 thanks

codepen.io/ilithya/full/MWjBBY

:sys_twitter: twitter.com/ilithya_rocks/stat

RT Stephanie Eckles
🟣 CSS Grid
Achieve responsive Grids in as little as 3-5 properties thanks to special functions like `repeat()`, `minmax()`, & `fr` unit.
Tutorials:
📺 Responsive Grid ~4 mins:
@CodePen w/ demo layouts:
moderncss.dev/topics/#grid
5t3ph.dev/rgs
codepen.io/5t3ph/pen/qBBgMdp

:sys_twitter: twitter.com/5t3ph/status/13525

RT Tatiana Mac
Happy Friday! I coded this @KingJames stat card. With a timebox of two hours, my goal was to not rely on media queries for responsiveness while maintaining the spirit of the design. Imperfect but done for now!
🔗 Codepen:
Los Angeles Lakers: These two were feelin' it from deep 🔥🔥

:sys_twitter: twitter.com/TatianaTMac/status

RT Louis Hoebregts
I recently saw a gif of an artist creating portraits with nothing but dices 🎲
Here is my version made with @p5xjs, @threejs_org & @greensock on @CodePen 👇
Turn on your webcam and watch the dices rolling 📹🎲
(yes perfs are aweful 😅)
codepen.io/Mamboleoo/pen/abmMw

:sys_twitter: twitter.com/Mamboleoo/status/1

RT Amit Sheen
Yesterday I had an amazing live coding session with the "CSS Masters Israel" community. We built an animated 3D dodecahedron, and talked a lot about perspective and transforms in CSS.
Full session: (in Hebrew)
The final result:
youtu.be/lU_UTTNrDJY
codepen.io/amit_sheen/pen/BaLb

:sys_twitter: twitter.com/amit_sheen/status/

RT Chris Coyier
Señor @alexquez and I chatting about a new internal service we built at @CodePen.
It's about hitting your own URLs rather than third-party URLs. It can be faster, cheaper, and more secure, with a smidge of work.
blog.codepen.io/2021/01/20/299

:sys_twitter: twitter.com/chriscoyier/status

RT Álvaro Montoro
Not as spectacular (or gassy) as other pens. But here's an entry for the challenge: an animation of a gassy shark... doo doo, doo doo doo doo!
codepen.io/alvaromontoro/full/

:sys_twitter: twitter.com/alvaro_montoro/sta

RT aexcode
For my second , I learned how to make this complex border with pure CSS & I incorporated some responsive text!
↗️
@CodePen
The image is a recreation of Mark Boehly's Hot Air Balloon Stamp on
@dribbble:
codepen.io/aexcode/full/oNzVWY
dribbble.com/shots/9108608-Hot

:sys_twitter: twitter.com/_aexcode/status/13

Show older
小森林

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