Image & Icon Cursors

Replace the default pointer with a custom image or a built-in icon, and align it precisely with the hotspot control.

By the end of this page, you'll have a custom image or icon replacing the default mouse pointer, aligned exactly where you want it.

Applies to Ultimate Cursor 2.3.1+.

When to use Image or Icon

Both types replace the pointer with visual artwork instead of text or a shape. Use Image when you have your own asset — a logo, product thumbnail, or hand-drawn graphic. Use Icon when you want a quick, consistent result from the built-in icon library without managing image files.

Pick either from Ultimate Cursor → General Settings → Select Cursor Type.

Ultimate Cursor image and icon cursor picker in the WordPress admin

Setting up an Image cursor

  1. Choose the Image card under Select Cursor Type.
  2. Open Customize Your Cursor → Cursor Type.
  3. Click the image field and upload or select an image from the Media Library (imageUrl).
  4. Set Image Size (imageSize, default 50px) to scale it.

Setting up an Icon cursor

  1. Choose the Icon card under Select Cursor Type.
  2. Open Customize Your Cursor → Cursor Type.
  3. Pick an icon from the built-in library (cursorIcon).
  4. Set Image Size (imageSize, default 28px for icons — smaller than the image default since icons are simpler shapes).

Sizing and border

Both types share the same border controls as other cursor types:

FieldTypeNotes
imageBorderStyleenumnone, solid, dotted, dashed, double, groove
imageBorderColorcolorborder color
imageBorderWidthnumberborder thickness

Hotspot alignment (Pro)

PRO By default the cursor's center is what tracks your mouse position. The hotspot control lets you pick which point of the image/icon tracks instead — useful for pointer-shaped icons where the tip, not the center, should sit under the click point.

Pick from a 3×3 quick-position grid (corners, edges, or center) directly on a live thumbnail of your image, or set exact imageHotspotX/imageHotspotY percentages by hand. On the free plan this control is locked; upgrading unlocks it immediately without re-saving your image.

Cursor image hotspot alignment control, Pro feature

Save & preview

Click Save Changes, then move your mouse over the live preview pane, and confirm on the frontend. If the image doesn't appear, check Common Issues — the most frequent cause is an unsaved change or a scope rule excluding the current page.