Ana Tudor
@anatudor.bsky.social
Same me, another platform. I code stuff. It usually involves some Maths. I enjoy music mandatory religion classes warned me about. And other things that may kill me.
https://thebabydino.github.io/
https://thebabydino.github.io/
Pinned
Ana Tudor
@anatudor.bsky.social
· Jul 31
Support Ana Tudor
If you like my work and you want me to be able to continue coding, please consider supporting it.
ko-fi.com
For anyone who missed it: I have now set up membership tiers on Ko-fi! #KofiMembershipChallenge
ko-fi.com/anatudor
Because praise doesn't keep me afloat... but you can!
ko-fi.com/anatudor
Because praise doesn't keep me afloat... but you can!
Also: reindeer fur is... not that soft to touch.
December 4, 2025 at 8:07 PM
Also: reindeer fur is... not that soft to touch.
Previous time I was in 🇸🇪 in '23, I started playing with SVG filters during a long wait for my north-bound train at Arlanda.
Ended up falling down a deep rabbit hole that resulted in hundreds of demos.
Now I've started redoing some of the early text effects ones with 2+ years of extra knowledge.
Ended up falling down a deep rabbit hole that resulted in hundreds of demos.
Now I've started redoing some of the early text effects ones with 2+ years of extra knowledge.
December 4, 2025 at 8:06 PM
Previous time I was in 🇸🇪 in '23, I started playing with SVG filters during a long wait for my north-bound train at Arlanda.
Ended up falling down a deep rabbit hole that resulted in hundreds of demos.
Now I've started redoing some of the early text effects ones with 2+ years of extra knowledge.
Ended up falling down a deep rabbit hole that resulted in hundreds of demos.
Now I've started redoing some of the early text effects ones with 2+ years of extra knowledge.
Reposted by Ana Tudor
💡 CSS Tip!
How many selectors do you know for the HTML element? Only two, right? There are more!
It's time to discover the hidden selectors of the HTML element.
css-tip.com/root-selecto...
Are they useful? Probably not, but it's a fun exploration of CSS selectors. Did I miss a cool selector?
How many selectors do you know for the HTML element? Only two, right? There are more!
It's time to discover the hidden selectors of the HTML element.
css-tip.com/root-selecto...
Are they useful? Probably not, but it's a fun exploration of CSS selectors. Did I miss a cool selector?
December 4, 2025 at 11:02 AM
💡 CSS Tip!
How many selectors do you know for the HTML element? Only two, right? There are more!
It's time to discover the hidden selectors of the HTML element.
css-tip.com/root-selecto...
Are they useful? Probably not, but it's a fun exploration of CSS selectors. Did I miss a cool selector?
How many selectors do you know for the HTML element? Only two, right? There are more!
It's time to discover the hidden selectors of the HTML element.
css-tip.com/root-selecto...
Are they useful? Probably not, but it's a fun exploration of CSS selectors. Did I miss a cool selector?
To access the free WiFi at the Munich airport, you can use [email protected].
Also some of my compatridiots on this flight really need to be told a Hell lot more often to STFU and stop polluting silence with their stupid crap.
Also some of my compatridiots on this flight really need to be told a Hell lot more often to STFU and stop polluting silence with their stupid crap.
December 4, 2025 at 6:52 AM
To access the free WiFi at the Munich airport, you can use [email protected].
Also some of my compatridiots on this flight really need to be told a Hell lot more often to STFU and stop polluting silence with their stupid crap.
Also some of my compatridiots on this flight really need to be told a Hell lot more often to STFU and stop polluting silence with their stupid crap.
Reposted by Ana Tudor
voted ⭐️
and others should too
Chromium
issues.chromium.org/issues/41208...
Firefox (10 years ago!)
bugzilla.mozilla.org/show_bug.cgi...
and others should too
Chromium
issues.chromium.org/issues/41208...
Firefox (10 years ago!)
bugzilla.mozilla.org/show_bug.cgi...
Chromium
issues.chromium.org
December 4, 2025 at 6:22 AM
voted ⭐️
and others should too
Chromium
issues.chromium.org/issues/41208...
Firefox (10 years ago!)
bugzilla.mozilla.org/show_bug.cgi...
and others should too
Chromium
issues.chromium.org/issues/41208...
Firefox (10 years ago!)
bugzilla.mozilla.org/show_bug.cgi...
I did not need another water pipe fiasco less than 4 hours before having to get ready to leave for the airport for my final concert trip of the year.
December 3, 2025 at 8:24 PM
I did not need another water pipe fiasco less than 4 hours before having to get ready to leave for the airport for my final concert trip of the year.
Reposted by Ana Tudor
Non-square image blur extensions in CSS. @anatudor.bsky.social shares a pattern for wrapping images in a square, padding gaps with a blurred copy, and optionally fading edges into the background for more flexible layouts. #css #webdev
frontendmasters.com/blog/non-squ...
frontendmasters.com/blog/non-squ...
December 3, 2025 at 11:09 AM
Non-square image blur extensions in CSS. @anatudor.bsky.social shares a pattern for wrapping images in a square, padding gaps with a blurred copy, and optionally fading edges into the background for more flexible layouts. #css #webdev
frontendmasters.com/blog/non-squ...
frontendmasters.com/blog/non-squ...
Reposted by Ana Tudor
I have a new article out on @frontendmasters.com: Non-Square Image Blur Extensions frontendmasters.com/blog/non-squ...
It details the how behind creating the base effect with a single `img` element and only 4 #CSS declarations, then... well, check the article, I promise you'll learn something new!
It details the how behind creating the base effect with a single `img` element and only 4 #CSS declarations, then... well, check the article, I promise you'll learn something new!
December 2, 2025 at 12:34 PM
I have a new article out on @frontendmasters.com: Non-Square Image Blur Extensions frontendmasters.com/blog/non-squ...
It details the how behind creating the base effect with a single `img` element and only 4 #CSS declarations, then... well, check the article, I promise you'll learn something new!
It details the how behind creating the base effect with a single `img` element and only 4 #CSS declarations, then... well, check the article, I promise you'll learn something new!
Reposted by Ana Tudor
About to have CSS ANCHOR POSITIONING FULLY CROSS-BROWSER!!
Gecko: Intent to ship: CSS Anchor Positioning
Gecko: Intent to ship: CSS Anchor Positioning
Gecko: Intent to ship: CSS Anchor Positioning
groups.google.com
December 2, 2025 at 11:52 PM
About to have CSS ANCHOR POSITIONING FULLY CROSS-BROWSER!!
Nothing happens until it happens, but... less than 72 hours left...
December 2, 2025 at 9:58 PM
Nothing happens until it happens, but... less than 72 hours left...
Reposted by Ana Tudor
You can now easily customize find-in-page with the new ::search-text pseudo-element, that is shipping in Chromium 144.0.7547. 🚀
Find more details on the blog post by Stephen Chenney: blogs.igalia.com/schenney/fin...
Thanks to Bloomberg for sponsoring this work.
Find more details on the blog post by Stephen Chenney: blogs.igalia.com/schenney/fin...
Thanks to Bloomberg for sponsoring this work.
December 2, 2025 at 11:31 AM
You can now easily customize find-in-page with the new ::search-text pseudo-element, that is shipping in Chromium 144.0.7547. 🚀
Find more details on the blog post by Stephen Chenney: blogs.igalia.com/schenney/fin...
Thanks to Bloomberg for sponsoring this work.
Find more details on the blog post by Stephen Chenney: blogs.igalia.com/schenney/fin...
Thanks to Bloomberg for sponsoring this work.
I have a new article out on @frontendmasters.com: Non-Square Image Blur Extensions frontendmasters.com/blog/non-squ...
It details the how behind creating the base effect with a single `img` element and only 4 #CSS declarations, then... well, check the article, I promise you'll learn something new!
It details the how behind creating the base effect with a single `img` element and only 4 #CSS declarations, then... well, check the article, I promise you'll learn something new!
December 2, 2025 at 12:34 PM
I have a new article out on @frontendmasters.com: Non-Square Image Blur Extensions frontendmasters.com/blog/non-squ...
It details the how behind creating the base effect with a single `img` element and only 4 #CSS declarations, then... well, check the article, I promise you'll learn something new!
It details the how behind creating the base effect with a single `img` element and only 4 #CSS declarations, then... well, check the article, I promise you'll learn something new!
Reposted by Ana Tudor
I made an interactive demo to illustrate the `contain` vs. `cover` values. You can play with picking various combinations of box and actual image aspect ratios.
Live demo on @codepen.io: codepen.io/thebabydino/...
#CSS
Live demo on @codepen.io: codepen.io/thebabydino/...
#CSS
December 1, 2025 at 4:11 PM
I made an interactive demo to illustrate the `contain` vs. `cover` values. You can play with picking various combinations of box and actual image aspect ratios.
Live demo on @codepen.io: codepen.io/thebabydino/...
#CSS
Live demo on @codepen.io: codepen.io/thebabydino/...
#CSS
December 2, 2025 at 11:38 AM
Because I had this in my head while cleaning my room earlier www.youtube.com/watch?v=VOCY...
#MotorheadMonday
#MotorheadMonday
Motörhead – Damage Case (Official Audio)
YouTube video by Motörhead Official
www.youtube.com
December 1, 2025 at 8:45 PM
Because I had this in my head while cleaning my room earlier www.youtube.com/watch?v=VOCY...
#MotorheadMonday
#MotorheadMonday
Reposted by Ana Tudor
Real transparency behind text/ around scrollable image. Shape changes as the text reflows. No JS, text isn't split into a span per line.
Can you figure out how to do this before checking out my solution? www.reddit.com/r/css/commen...
Live on @codepen.io: codepen.io/thebabydino/...
#CSS #concave
Can you figure out how to do this before checking out my solution? www.reddit.com/r/css/commen...
Live on @codepen.io: codepen.io/thebabydino/...
#CSS #concave
October 30, 2025 at 9:14 AM
Real transparency behind text/ around scrollable image. Shape changes as the text reflows. No JS, text isn't split into a span per line.
Can you figure out how to do this before checking out my solution? www.reddit.com/r/css/commen...
Live on @codepen.io: codepen.io/thebabydino/...
#CSS #concave
Can you figure out how to do this before checking out my solution? www.reddit.com/r/css/commen...
Live on @codepen.io: codepen.io/thebabydino/...
#CSS #concave
I made an interactive demo to illustrate the `contain` vs. `cover` values. You can play with picking various combinations of box and actual image aspect ratios.
Live demo on @codepen.io: codepen.io/thebabydino/...
#CSS
Live demo on @codepen.io: codepen.io/thebabydino/...
#CSS
December 1, 2025 at 4:11 PM
I made an interactive demo to illustrate the `contain` vs. `cover` values. You can play with picking various combinations of box and actual image aspect ratios.
Live demo on @codepen.io: codepen.io/thebabydino/...
#CSS
Live demo on @codepen.io: codepen.io/thebabydino/...
#CSS
Monday morning tunes
www.youtube.com/watch?v=l5-b...
Still love this song. Shows don't happen until they happen, but, you know... 4 days and a half to go...
www.youtube.com/watch?v=l5-b...
Still love this song. Shows don't happen until they happen, but, you know... 4 days and a half to go...
Pretty Maids - "Undress Your Madness" (Official Audio) #PrettyMaids #UndressYourMadness
YouTube video by Frontiers Music srl
www.youtube.com
December 1, 2025 at 10:32 AM
Monday morning tunes
www.youtube.com/watch?v=l5-b...
Still love this song. Shows don't happen until they happen, but, you know... 4 days and a half to go...
www.youtube.com/watch?v=l5-b...
Still love this song. Shows don't happen until they happen, but, you know... 4 days and a half to go...
Reposted by Ana Tudor
The classic Breadcrumb Navigation using the below technique.
Demo: codepen.io/t_afif/full/... via @codepen.io
Demo: codepen.io/t_afif/full/... via @codepen.io
November 27, 2025 at 7:53 PM
The classic Breadcrumb Navigation using the below technique.
Demo: codepen.io/t_afif/full/... via @codepen.io
Demo: codepen.io/t_afif/full/... via @codepen.io
Reposted by Ana Tudor
And yet, the only way I was able to build this UI was by giving the AI the right answer, telling it to use subgrid instead of `display: contents`.
If I didn’t understand the mechanisms and limitations of CSS Grid layout myself, I wouldn’t have been able to provide this guidance.
If I didn’t understand the mechanisms and limitations of CSS Grid layout myself, I wouldn’t have been able to provide this guidance.
November 30, 2025 at 4:31 PM
And yet, the only way I was able to build this UI was by giving the AI the right answer, telling it to use subgrid instead of `display: contents`.
If I didn’t understand the mechanisms and limitations of CSS Grid layout myself, I wouldn’t have been able to provide this guidance.
If I didn’t understand the mechanisms and limitations of CSS Grid layout myself, I wouldn’t have been able to provide this guidance.
Reposted by Ana Tudor
An Amur tiger's canine tooth. My swollen finger for comparison.
This cat's equipment is no joke.
#tiger 🐯 #Wilhelma #Stuttgart
This cat's equipment is no joke.
#tiger 🐯 #Wilhelma #Stuttgart
November 30, 2025 at 9:36 AM
An Amur tiger's canine tooth. My swollen finger for comparison.
This cat's equipment is no joke.
#tiger 🐯 #Wilhelma #Stuttgart
This cat's equipment is no joke.
#tiger 🐯 #Wilhelma #Stuttgart
Reposted by Ana Tudor
Reposted by Ana Tudor
Augsburg, you've been lovely!
Well, minus the shit weather yesterday, when I got the feeling some of the animals at the zoo were giving me "never thought I'd see someone stupid enough to go around in this weather" looks.
Well, minus the shit weather yesterday, when I got the feeling some of the animals at the zoo were giving me "never thought I'd see someone stupid enough to go around in this weather" looks.
November 27, 2025 at 1:47 PM
Augsburg, you've been lovely!
Well, minus the shit weather yesterday, when I got the feeling some of the animals at the zoo were giving me "never thought I'd see someone stupid enough to go around in this weather" looks.
Well, minus the shit weather yesterday, when I got the feeling some of the animals at the zoo were giving me "never thought I'd see someone stupid enough to go around in this weather" looks.