Filling Point

Description Filling Point paints Framer CTAs from the exact pointer-enter point: three solid disks expand from a seed that touches the nearest button border, then retract in…

A cinematic pointer-origin fill that turns every hover into a three-beat paint event. Description Filling Point paints Framer CTAs from the exact pointer-enter point: three solid disks expand from a seed that touches the nearest button border, then retract in reverse. Choose Cinematic, Balanced, Snappy, or Custom enter/exit. Solid and Soft fill styles, curated color layers, touch and keyboard feedback, reduced-motion support, and a canvas-safe idle state. Zero external packages. Categories / tags Components · Buttons · Calls to Action · Hover · Motion · Interaction · Editorial · Portfolio · Accessibility Features Shared pointer-enter origin across all paint layers Seed circumference starts at the nearest button border Three-beat forward cascade and reverse leave Solid and Soft fill styles (Soft = gradient wash, not blur) Cinematic, Balanced, Snappy, and Custom motion Configurable colors and 0–360ms layer delays Touch, keyboard, focus-visible, and reduced-motion behavior Difference-blend label contrast on live hover Canvas/export idle state Zero external dependencies

A cinematic pointer-origin fill.