Press and Hold Link

Overview

This component lets users open a link by holding left click until a smooth countdown finishes. It is designed for interaction patterns that require intention, clarity and a bit of playful feedback. Every visual element can be adapted so it fits perfectly into your design system.

Features

• Customize duration of the hold

• Adjust ring width, color, background, line cap and size

• Optional numbered countdown with full font control

• Optional tooltip for accessibility with padding, font and color settings

• Control the placement of all elements around the cursor

• Enable and customize an overlay that appears while holding

How to use

1. Paste component into your prefered frame

2. Set the component's position type to "absolute"

3. Pin it to all four edges with value "0"

4. Add Z-Index above 2

The component now fills up the dimensions of the parent frame.