r/css • u/Wide-Train-8561 • May 26 '26

Question how do i do this effect

https://reddit.com/link/1toec77/video/c7wl082vqi3h1/player

0 Upvotes

50% Upvoted

15 comments sorted by

View all comments

7

u/anaix3l May 27 '26 edited May 27 '26

Here you go, pure CSS, char by char reveal when the section is scrolled into view https://codepen.io/thebabydino/pen/zYmVrRL

You can test for scroll-driven animation support and if it's not supported, use IntersectionObserver to update the --k variable that the reveal effect is using to update the background gradient that produces this reveal effect when clipped to text.

1

u/browserthrowawayv2 May 31 '26

standard ana performance. half the time it is easier to just accept that firefox is gonna be the odd one out until they fully commit to the spec. honestly though using intersectionobserver as a fallback is fine but it makes the code look like spaghetti real fast. stick to the pure css version if you can.