Links
Theming Animations Using CSS Relative Colour
CSS relative colour values are now widely supported. In this article, pioneering author and web designer Andy Clarke shares practical techniques for using them to theme and animate SVG graphics.
Death to Scroll Fade!
We’re all developers here. Can we collectively pretend scroll fade is technically impossible now? Or like, say they made it illegal because nonagenarians don’t have time for such nonsense? Sorry I’ve lost track. This was supposed to be a serious post. Scroll fade is not a “quick win” that can be tacked onto the end of a front-end build. It takes a lot of effort. Who is willing to adequately test it? You have to plan this stuff from day one. Plan the entire website architecture around it. Or just say NO! Death to scroll fade!
Accessible faux-nested interactive controls
A really common user interface pattern is a big clickable area, such as a card. Sometimes you need controls within that card that are also clickable. There's lots of ways to do it wrong, but fret not, Eric is here to show you how to do it right.
Popover Context Menus with Anchor Positioning
A context menu is like a tooltip in that it opens right next to the the thing that opened it. Here, we animate the opening and ensure it opens somewhere where it doesn't get cut off.
Dark Mode - Essential not a Preference
For blind and low-vision users, as well as some neurodivergent individuals, dark mode is not just a preference—it is a necessity. It reduces glare, enhances contrast, and extends the time users can comfortably engage with digital content. Without it, users experience fatigue, headaches, and even an inability to complete tasks, ultimately leading to frustration, abandonment, and exclusion from digital services.
Videos
Practical Use-Cases for “overflow: clip;”
A brief guide outlining the difference between
overflow: hiddenandoverflow: clip, along with practical use cases when you’ll findoverflow: cliplife-saving.
Sponsor
Sponsored by Cloud Four
Thanks to Cloud Four for sponsoring this week’s newsletter! They solve complex responsive web design and development challenges for ecommerce, healthcare, fashion, B2B, SaaS, and nonprofit organizations.
If you’d like to help with the costs of running Friday Front-End, you can back our Patreon for as little as a dollar a month.