Want to give a responsive irregular shape depending on text content/ viewport rounded corners? Here's a super simple pure #CSS + #SVG #filter demo on @codepen doing it https://codepen.io/thebabydino/pen/KwKGrjR
Heavily commented. See also https://mastodon.social/@anatudor/114185324674119212 for details about some of the filter primitives.
Here's a simple image stack with an `--ang` rotation around an `--xy` point (both pseudo-random, generated & set inline via Pug) + a 3D entry animation (click Run to run it again).
Live on @codepen https://codepen.io/thebabydino/pen/qEBJpRb?editors=0100
Because I keep seeing `position: absolute` + lots of of offset + size + transform + sometimes even margin properties to stack + middle align the stacked items... you can easily do it with 3 #CSS properties!
Flip card on hover, flip back on hover out...
... but on touchscreens, flip it on click and then flip it back on second click!
A mostly #CSS solution, using #3D transforms, variables, grid, pointer MQ + a little bit of #JS.
Because somebody asked how to do it https://www.reddit.com/r/css/comments/1jm0a7v/comment/mk7zmd5/
Live demo on @codepen: https://codepen.io/thebabydino/pen/MYWPeer
They’ve been saying “PHP is dead” for almost 30 years.
In 1995, they said "learn ColdFusion instead."
1999: "Java and J2EE is the Future."
2002: "Drop PHP, use ASP.NET."
2003: "Django is the future."
2004: "Ruby on Rails is the real deal."
2010: "Try Flask."
2011: "AngularJS is the way."
2016: "Next.js is the new wave."
Maybe PHP is still popular because there was never a hype around it. 
How’s them vibes?
(Almost like it’s good to know what you’re doing when you do something.)
Via @stefan (Web Weekly newsletter #155 – https://www.stefanjudis.com/blog/web-weekly-155/)
Can't believe this quick little thing made this week's @codepen Spark!
codepen.io/thebabydino/pen/GgRryoa
No JS #fluid animation. The animation is created in #CSS, where I'm animating the values of two custom properties back and forth. `feTurbulence` creates the background, `feDisplacement` map uses the CSS-animated input to make it move.
My take on this question https://www.reddit.com/r/webdev/comments/1izlhkw/comment/mfedw8s/
I don't know Rick...
"Amazon says developers spend 'just one hour per day' on actual coding" from Fortune
https://fortune.com/2024/12/05/amazon-developers-spend-hour-per-day-coding/
Another pure CSS & SVG thing I made on @codepen last week for the #CodePenChallenge: https://codepen.io/thebabydino/pen/yLWjMWB
Idea from https://codepen.io/gabrielcojea/pen/GRoqOYm but using no JS for scroll-triggered transitions and no text duplication for the dynamic headline-image intersection.
cc @bramus
The how behind is really simple.
We use the individual RGB channel extraction tactic from https://mastodon.social/@anatudor/112095185713025704
Then we offset two of the individual RGB channels along different directions and then recombine the post-offset RGB channels.
Ever wanted to add chromatic aberration to an image?
It's possible with a simple #SVG #filter! No layering of multiple images or any other tricks needed https://codepen.io/thebabydino/pen/Jjzvbba
