Group Cursor Follow

Group Cursor Follow

About Group Cursor Follow

About

This component a part of the 400+ components, layouts, templates, UI Kits and code overrides from SegmentUI PRO. Click here to see the full library

Instructions

  1. Copy and paste the component card into your project file and detach it

  2. Select the image cursor component and customize properties:

    • Upload images or use image URLs

    • Adjust delay, spread, and motion blur for desired effect

    • Set cursor alignment and max width

    • Fine-tune border radius as needed

  3. The cursor effect will automatically work when users move their mouse within the component's bounds

How It Works

The component uses these key properties:

  • images: Array of images to display (up to 10)

  • delay: Time delay between image movements (0-1s)

  • maxWidth: Maximum width of each image (10-500px)

  • cursorAlign: Position of images relative to cursor

  • spread: Random spread distance between images (0-200px)

  • motionBlur: Blur effect based on movement (0-20px)

  • borderRadius: Corner radius of images

Support

For any queries and help setting up the component, contact hello@segmentui.com