Skip to content

component

FocusFrame Cursor

By Anup Nalawade

Details

Summary

FocusFrame Cursor replaces the browser pointer with four animated brackets that attach to links, buttons, form controls, and pointer-enabled Framer layers.

Description

FocusFrame Cursor replaces the browser pointer with four animated brackets that attach to links, buttons, form controls, and pointer-enabled Framer layers. Unlike a standard circle or crosshair follower, the cursor frames the actual target bounds. Square elements keep sharp corners, rounded elements retain their shape, and every transition can be tuned with Framer's native Transition control. Features Automatic snapping to clickable elements Support for standard controls and pointer-enabled Framer layers Per-corner radius matching with square-corner preservation Separate follow, snap, and click colors Inward or outward click feedback Adjustable size, offset, corner length, stroke, tilt, and snap gap Grouped controls for quick setup Optional native-cursor and free-follower visibility Normal and difference blend modes Framer-native Transition control Reduced-motion support Touch-safe behavior with no blocked interactions No external assets, APIs, tracking, or runtime dependencies Setup Add one instance to a page or shared layout. Preview the site, then customize the appearance and motion from the Framer property panel. Compatibility Notes Designed for desktop and other fine-pointer devices Automatically stays inactive on touch-only devices Uses the target's viewport-aligned bounding box Does not track inside cross-origin iframes or browser chrome Preview Link Click Here

Introduction

Adaptive cursor corner framing

Rank history

Daily rank per list, from the first snapshot — lower is better.

12001400146388/148/228/309/79/15
  • All · #4638