DEV Community

Cover image for How I built a realistic page-turn effect for any web page (WebGL + Chrome Manifest V3)
Muhammad Muzammil
Muhammad Muzammil

Posted on

How I built a realistic page-turn effect for any web page (WebGL + Chrome Manifest V3)

I wanted to read web pages like a book, so I built FlipRead, a free page flip reader extension. Here's how the page curl works, what broke, and what I learned about Chrome permissions.

Sections: 1) Why scrolling hurts focus 2) Paging a page you don't control 3) The page curl: screenshot, cylinder bend, shaders 4) Fallbacks and performance 5) Surprises (activeTab, CSP, inner scrollers) 6) Try it:
https://flipread.netlify.app/
chromeextension, webgl, javascript, webdev

Top comments (0)