Focus Frame
Achieving the popular "inset blur" or "frosted border" effect in web design usually requires complex absolute positioning and manual math to keep layers aligned. If you resize the frame, the effect breaks.
Focus Frame solves this.
This smart component uses a single image source to populate both the sharp foreground and the blurred background simultaneously. Using advanced negative-offset constraints, the background blur is automatically calculated to prevent white edge-bleeding, ensuring a clean, cinematic look at any aspect ratio.
Perfect for team bios, feature highlights, or gallery items where you need high contrast and visual depth.
Features:
Single Source of Truth: Upload your image once; the component handles the rest.
Auto-Alignment: Resize the component freely—the inner image never drifts from the background.
Bleed Correction: Built-in overflow compensation eliminates the common "white halo" caused by web-based Gaussian blurs.
Fully Customizable: Tweak the border thickness, overlay colour/tint, and corner radius directly from the properties panel.
Izzy
