"My living room" by Patricia Masigla (Make sure to follow the link to the photo of her IRL living room).
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.
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 😭)
It's the final week of the January #CodePenChallenge!
To wrap up the States of Matter Challenge, our host @rosieebob has us experimenting with the plasma state of matter ☀️
RT Fabrizio Calderan
1/2 — Be aware of these special CSS keywords: fit-content, min-content and max-content.
✨ New scroll-animations demo: A (contact) list where items that come into view fly-in.
Comes in two flavors:
- CSS-only with @scroll-timeline:
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
RT Stephanie Eckles
🟣 CSS Grid
Achieve responsive Grids in as little as 3-5 properties thanks to special functions like `repeat()`, `minmax()`, & `fr` unit.
📺 Responsive Grid ~4 mins:
@CodePen w/ demo layouts:
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!
Los Angeles Lakers: These two were feelin' it from deep 🔥🔥 #LakersWin
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 😅)
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:
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.
RT Álvaro Montoro
Not as spectacular (or gassy) as other pens. But here's an entry for the #CodePen challenge: an animation of a gassy shark... doo doo, doo doo doo doo!
For my second #codepenchallenge, I learned how to make this complex border with pure CSS & I incorporated some responsive text!
The image is a recreation of Mark Boehly's Hot Air Balloon Stamp on
RT David Fitzgibbon
Re A quick doodle of Andy Warhol's Marilyn Monroe portrait in @p5xjs
Build, test, and discover front-end code 👩🏽💻