component
EdgeBlend
By Ramcharantej Paka
Details
- Ramcharantej PakaAuthor
- componentType
- $5.00Price
- 2026-04-28Published
- 2026-04-28Updated
- 2026-04-19Added
- BackgroundsCategories
Summary
Flawless image fades for Framer.
Description
Artifact-Free Rendering: Powered by a custom Canvas shader and 9-slice geometry. No overlapping alpha bleeds, no diagonal Mach banding—just pure, buttery smooth transitions into any background. Logarithmic Tension Curves: Take ultimate control. Set your Depth (0–800px) and use the Midpoint slider to keep your subject crisp in the centre before dropping the opacity on a perfect, smooth step curve. 5 Native Shapes: Feather edges across Rectangles, Squares, Circles, Ovals, and Triangles with custom vector-normal math. Studio Blend Modes: Neutralize harsh original backgrounds by applying 12+ composite blend modes (Multiply, Overlay, Screen) and custom colour tints directly to the image pixels. Responsive & CMS Ready: Engineered with a DOM-anchor ghost image to maintain true aspect ratios natively. "Fit Content" works flawlessly, it scales perfectly on mobile, and hooks up instantly to your Framer CMS image fields. Production-Grade Architecture: Hydration-safe for SSG/SSR published sites. Your images will never vanish on the live site, loading eagerly with zero layout shift.
Introduction
Flawless image fades for Framer.
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #6781