{"repo":"harshmandan/svelte-overflow-fade","free":true,"listed":false,"github":"https://github.com/harshmandan/svelte-overflow-fade","clone":"git clone https://github.com/harshmandan/svelte-overflow-fade.git","description":"Svelte attachment and action to enable overflow fade ✨","language":"Svelte","stars":28,"topics":["css","library","svelte","sveltejs","sveltekit"],"license":"MIT","category":"saas-starters-boilerplates","readme_excerpt":"svelte-overflow-fade A Svelte action and attachment for adding beautiful fade effects to overflowing content 🖼️ Demo Live Demo → ✨ Features - 🎨 Two fade modes : CSS mask-based or DOM element-based - 🔄 Dual API support : Actions for all Svelte versions, Attachments for Svelte 5.29+ - 📏 Directional scrolling : Supports both horizontal and vertical overflow - 🎯 Smart detection : Automatically shows/hides fades based on scroll position - ⚡ Performant : Throttled scroll events and optimized animations - 🌗 Dark mode ready : Works seamlessly with any color scheme - 📦 Zero dependencies : Lightweight and self-contained 📦 Installation 🚀 Quick Start Using the Action API (All Svelte versions) Using the Attachment API (Svelte 5.29+) Fading all four edges Set axis: 'both' to fade every edge at once — useful for content that scrolls in both directions (large tables, canvases, image grids). The two axis masks are composited together so corners fade correctly rather than one axis overwriting the other. sides still applies here: 'start' fades top + left, 'end' fades bottom + right, 'both' (default) fades all four edges. ⚙️ Configuration Options Option Type Description ---------------------- --------------------- --------------------------------------------- axis 'x' \\ 'y' \\ 'both' Direction of scroll. 'both' fades all four edges at once sides 'both' \\ 'start' \\ 'end' Which edge to fade (default 'both' ). 'start' = top/left, 'end' = bottom/right, relative to axis (with axis: 'both' , '","default_branch":null,"files":null,"tree":[],"storefront":"/r/harshmandan","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/harshmandan/svelte-overflow-fade/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}