Blenra LogoBlenra
Optimized for: Gemini / ChatGPT / Claude
#UI

Advanced AI Prompt for Custom Cursor with Progress Ring Integration

Customize the variables below to instantly engineer your prompt.

Required Variables

custom-cursor-progress-ring-integration.txt
Act as a UX Micro-Interactions Developer. Create a highly functional custom cursor that replaces traditional UI loading states with an integrated 'hold-to-confirm' progress ring. The cursor must feature a pristine SVG `<circle>` path that visually 'fills' its circumference with [RING_COLOR] at a thickness of [STROKE_WIDTH] exactly over the duration of [CLICK_DURATION] milliseconds while the user holds the `mousedown` event. Drive the animation entirely by mathematically interpolating the CSS `stroke-dashoffset` property. Inject critical logic to instantly abort and reverse the animation if the user triggers a `mouseup` or moves the mouse away before the timer completes. You must embed W3C-compliant ARIA live regions (`aria-live='polite'`) to audibly notify screen reader users of the ongoing 'hold' progress and the final completed action.

Example Text Output

"An SVG/JS combo that animates a circular progress bar around the cursor tip, triggering a callback function upon completion."

More Web Components Prompts

View all →

Frequently Asked Questions

What is the "Advanced AI Prompt for Custom Cursor with Progress Ring Integration" prompt used for?

An SVG/JS combo that animates a circular progress bar around the cursor tip, triggering a callback function upon completion.

Which AI tools work with this prompt?

This prompt is optimized for Gemini / ChatGPT / Claude, but works great with ChatGPT, Claude, Gemini, and other large language models. Simply copy it and paste it into your preferred AI tool.

How do I customize this prompt?

Use the variable fields above to fill in your specific details. The prompt will auto-update as you type, ready to copy instantly.

Is this prompt free?

Yes! All prompts on Blenra are free to copy and use immediately. No account required.