THthebiblelover7·Jun 25, 2026
How it works: https://github.com/petekp/tw-fade#how-it-works
In Tw-fade: pure CSS scroll-driven edge maskingpetekp
tw-fade
JavaScript2026–2026
petekp / tw-fade
tw-fade
Elegant, CSS-driven scroll-edge fade masking for Tailwind CSS v4. Zero JavaScript.
2Distinct people
2Mentions
0Explicit recommenders
106GitHub stars
What to know before exploring
What it is
Elegant, CSS-driven scroll-edge fade masking for Tailwind CSS v4. Zero JavaScript.
GitHub
Where it is used
No documented product use has been verified yet.
What people are saying
No recommendation phrase was found in the indexed comments.
No classified warning is attached to this page. Read the discussions before treating silence as approval.
Also in these discussions
No other repository is repeatedly linked in the same discussions.
This week on Hacker News
Nov 7–Nov 14 UTC · Direct repository links and separately labeled related project stories. Indexed through 11/14/2026, 5:04:57 PM UTC.
No direct repository links were found in the indexed HN discussions over the past seven days. Older discussions are available below.
Mentions over time
HN mentions by 3-hour interval2 dated mentions
Observed mentions: 2026-06-22 15:12:36 UTC to 2026-06-25 18:14:28 UTC.
Counts come from the repository’s dated source evidence. Index cutoff: 2026-11-02 08:16:59 UTC.
View mention counts and date ranges
| Period | Start (UTC) | End (exclusive, UTC) | Mentions | Submissions | Comments |
|---|---|---|---|---|---|
| Jun 22, 15:00 | 2026-06-22 15:00:00 UTC | 2026-06-22 18:00:00 UTC | 1 | 0 | 1 |
| Jun 22, 18:00 | 2026-06-22 18:00:00 UTC | 2026-06-22 21:00:00 UTC | 0 | 0 | 0 |
| Jun 22, 21:00 | 2026-06-22 21:00:00 UTC | 2026-06-23 00:00:00 UTC | 0 | 0 | 0 |
| Jun 23, 00:00 | 2026-06-23 00:00:00 UTC | 2026-06-23 03:00:00 UTC | 0 | 0 | 0 |
| Jun 23, 03:00 | 2026-06-23 03:00:00 UTC | 2026-06-23 06:00:00 UTC | 0 | 0 | 0 |
| Jun 23, 06:00 | 2026-06-23 06:00:00 UTC | 2026-06-23 09:00:00 UTC | 0 | 0 | 0 |
| Jun 23, 09:00 | 2026-06-23 09:00:00 UTC | 2026-06-23 12:00:00 UTC | 0 | 0 | 0 |
| Jun 23, 12:00 | 2026-06-23 12:00:00 UTC | 2026-06-23 15:00:00 UTC | 0 | 0 | 0 |
| Jun 23, 15:00 | 2026-06-23 15:00:00 UTC | 2026-06-23 18:00:00 UTC | 0 | 0 | 0 |
| Jun 23, 18:00 | 2026-06-23 18:00:00 UTC | 2026-06-23 21:00:00 UTC | 0 | 0 | 0 |
| Jun 23, 21:00 | 2026-06-23 21:00:00 UTC | 2026-06-24 00:00:00 UTC | 0 | 0 | 0 |
| Jun 24, 00:00 | 2026-06-24 00:00:00 UTC | 2026-06-24 03:00:00 UTC | 0 | 0 | 0 |
| Jun 24, 03:00 | 2026-06-24 03:00:00 UTC | 2026-06-24 06:00:00 UTC | 0 | 0 | 0 |
| Jun 24, 06:00 | 2026-06-24 06:00:00 UTC | 2026-06-24 09:00:00 UTC | 0 | 0 | 0 |
| Jun 24, 09:00 | 2026-06-24 09:00:00 UTC | 2026-06-24 12:00:00 UTC | 0 | 0 | 0 |
| Jun 24, 12:00 | 2026-06-24 12:00:00 UTC | 2026-06-24 15:00:00 UTC | 0 | 0 | 0 |
| Jun 24, 15:00 | 2026-06-24 15:00:00 UTC | 2026-06-24 18:00:00 UTC | 0 | 0 | 0 |
| Jun 24, 18:00 | 2026-06-24 18:00:00 UTC | 2026-06-24 21:00:00 UTC | 0 | 0 | 0 |
| Jun 24, 21:00 | 2026-06-24 21:00:00 UTC | 2026-06-25 00:00:00 UTC | 0 | 0 | 0 |
| Jun 25, 00:00 | 2026-06-25 00:00:00 UTC | 2026-06-25 03:00:00 UTC | 0 | 0 | 0 |
| Jun 25, 03:00 | 2026-06-25 03:00:00 UTC | 2026-06-25 06:00:00 UTC | 0 | 0 | 0 |
| Jun 25, 06:00 | 2026-06-25 06:00:00 UTC | 2026-06-25 09:00:00 UTC | 0 | 0 | 0 |
| Jun 25, 09:00 | 2026-06-25 09:00:00 UTC | 2026-06-25 12:00:00 UTC | 0 | 0 | 0 |
| Jun 25, 12:00 | 2026-06-25 12:00:00 UTC | 2026-06-25 15:00:00 UTC | 0 | 0 | 0 |
| Jun 25, 15:00 | 2026-06-25 15:00:00 UTC | 2026-06-25 18:00:00 UTC | 0 | 0 | 0 |
| Jun 25, 18:00 | 2026-06-25 18:00:00 UTC | 2026-06-25 21:00:00 UTC | 1 | 0 | 1 |
What Hacker News says
2 sourceshey all, just released a plugin to scratch an itch. i'd been lazily adding linear gradients on the edges of scrollviews and animating them with JS based on scroll position. turns out you can do a lot better with pure CSS now by leveraging masking + the new CSS scroll animations API.
works in pretty much all browers excepting firefox which doesn't have CSS scroll animations yet, but the nightly version does, so it should be generally available soon.
demo site: https://pete.design/tw-fade
github: https://github.com/petekp/tw-fade
npmjs: https://www.npmjs.com/package/tw-fade
if you use it i'd love to hear how it goes and if you have any feedback.
In Tw-fade: pure CSS scroll-driven edge masking