Kilian Valkhof

My take on fading content using transparent gradients in CSS

https://polypane.app/blog/my-take-on-fading-content-using-transparent-gradients-in-css/

So that's two ways to fade text content. mask-image is a little more flexible, but background-clip is a little more widely supported. Both are great ways to fade text content, and I hope you can use them in your projects!

• Older: Where have all the flowers gone?
• Newer: Platform Tilt: Documenting the Uneven Playing Field for an Independent Browser Like Firefox

Related contents with similar topics

1. 

   Craig Abbott

   Our CSS isn’t opinionated enough

   • Nicolas Hoizey
   • 2 November 2026
   • CSS
   • 4 reactions

   We’ve built and pushed a “best practice” way of working where appearance and semantic meaning are completely decoupled. Then, we’re weirdly surprised…

2. 

   Ahmad El-Alfy

   A select should tell you something

   • Nicolas Hoizey
   • 2 November 2026
   • HTML, CSS, UX
   • 2 reactions

   We finally can style a select. The bigger change is what an option can hold. Until now, an option was one line of plain text, so everything a person…

3. 

   Patrick Brosset

   Alignment in CSS Grid Lanes

   • Nicolas Hoizey
   • 13 October 2026
   • CSS, Grid Lanes
   • 5 reactions

   […] here is the really interesting part, aligning individual items along the stacking axis. At first sight, this might seem surprising. After all,…

4. 

   Jake Archibald

   Controlling when CSS custom property values are computed

   • Nicolas Hoizey
   • 15 September 2026
   • CSS
   • 2 reactions

   When and how CSS custom property values are calculated might not be what you expect, and it has a big impact on your styles.

5. 

   Josh W. Comeau

   Scroll-Driven Animations

   • Nicolas Hoizey
   • 30 April 2026
   • CSS, animations
   • 4 reactions

   The CSSWG deserves a lot of credit, in my opinion, for repurposing/extending CSS keyframe animations for scroll-driven animations. Rather than invent…