Update v2.1

Custom Grab Cursors v2.1

Overview

Transform any webpage's grab and grabbing cursors into stylish, customizable images with flexible hotspot positioning, cursor pack management, and an elegant multi-theme UI.

---

Features

✨ Custom Cursor Images – Replace default grab/grabbing cursors with your own PNG images
🗂️ Cursor Packs – Create, clone, import and export full cursor packs as .zip folders
🎯 Flexible Hotspot Control – Adjust cursor hotspot coordinates individually or sync both cursors
🎨 Multiple UI Themes – Choose from Light, Dark, Neon, Cherry, and Blueberry themes
⚡ One-Click Enable/Disable – Toggle the extension without uninstalling
💾 Instant Updates – Changes apply immediately to all open tabs
🔒 Safe & Lightweight – Only affects grab cursors, never hijacks pointer or default cursors
📦 Settings Export/Import – Save and restore your theme, enable state, and pack settings via settings.json
⭐ Built-in Packs – Comes with Mac OS, Windows 11 Light, and Windows 11 Dark cursor packs out of the box

---

What's New in v2.1

• ✅ Cursor Pack system – Full multi-pack support with create, clone, delete, import and export
• ✅ Built-in packs – Mac OS, Windows 11 Light, Windows 11 Dark included out of the box
• ✅ Pack import/export – Export any pack as a .zip (folder → grab.png, grabbing.png, info.json), import from folder
• ✅ Drag-to-reorder – Drag pack cards to reorder them in the library
• ✅ Unavailable image placeholder – New empty packs show a clear placeholder instead of a broken image
• ✅ Multiple UI themes – Light, Dark, Neon, Cherry, and new Blueberry theme
• ✅ Settings export/import – Save theme and hotspot preferences to settings.json and restore them later
• ✅ Readonly built-in packs – Built-in packs are protected; clone them to customize
• ✅ Per-pack hotspot control – Each pack stores its own hotspot settings independently
• ✅ Sandbox preview – Live preview box respects the enable/disable toggle
• ✅ Footer links – Quick links to YouTube and GitHub from the settings page
• ✅ Styled file inputs – All file pickers use consistent styled buttons throughout the UI

---

Installation

1. Clone or download this repository
2. Open Chrome/Edge and go to chrome://extensions (or edge://extensions)
3. Enable Developer mode (top-right corner)
4. Click Load unpacked and select the extension folder
5. The extension is now active!

---

How to Use

Configure Cursors

1. Click the extension icon and select Options
2. Go to the Library tab
3. Click a built-in pack to activate it, or click + Create empty pack to make your own
4. Upload PNG files for grab and grabbing cursors
5. Adjust hotspot coordinates (X, Y) for precise cursor alignment
6. Toggle "Use same hotspot for both cursors" for independent control
7. Changes apply instantly ✨

Cursor Packs

• Create – Start from scratch with an empty pack
• Clone – Duplicate any pack (including built-ins) to customize it
• Import – Select a folder containing grab.png, grabbing.png, and info.json
• Export – Downloads a .zip with your pack's folder structure ready to share
• Reorder – Drag and drop pack cards to reorder them

Settings Export / Import

• Export (settings.json) – Saves your current theme, enable state, and hotspot settings for all packs
• Import (settings.json) – Restores settings; only applies to packs that already exist, cursor images are never overwritten

---

Hotspot Explained

The hotspot is the exact pixel point where the cursor registers. Default is (16, 16) — the center of a 32×32 cursor image.

• Sync mode (default): One setting controls both grab and grabbing cursors
• Separate mode: Fine-tune each cursor's hotspot independently

---

How It Works

The extension uses a lightweight MutationObserver to detect grab cursors on page elements and replaces them with your custom images. It intelligently avoids interfering with:

• Default pointer cursors
• Generic draggable elements
• Other cursor types

Only elements explicitly using grab/grabbing cursors (or marked with data-grab="true") are affected.

---

Browser Support

• ✅ Chrome/Chromium (v90+)
• ✅ Microsoft Edge
• ✅ Other Chromium-based browsers

---

Credits

Developed by Yossof0
If you share or use this extension, please give credit to the original author.

• 📺 [YouTube – @OverClock33](https://www.youtube.com/@OverClock33)
• 🐙 [GitHub – Yossof0](https://github.com/Yossof0/)

---

License

Open source – feel free to modify and distribute (with attribution).

---

Happy customizing! 🎉

Update V3

Custom Grab Cursors v3.0

Overview

Transform any webpage's grab and grabbing cursors into stylish, customizable images with full cursor pack management, a powerful theme engine, and a polished multi-theme UI.

---

Features

✨ Custom Cursor Images – Replace default grab/grabbing cursors with your own PNG images
🗂️ Cursor Packs – Create, clone, import and export full cursor packs as .zip folders
🎯 Flexible Hotspot Control – Adjust cursor hotspot coordinates individually or sync both cursors — saved per pack
🎨 9 Built-in Themes + Custom Theme Engine – Create, clone, export and import your own themes
⚡ One-Click Enable/Disable – Toggle the extension without uninstalling
💾 Instant Updates – Changes apply immediately to all open tabs
🔒 Safe & Lightweight – Only affects grab cursors, never hijacks pointer or default cursors
📦 Settings Export/Import – Save and restore everything via settings.json, including custom themes
⭐ Built-in Packs – Mac OS, Windows 11 Light, and Windows 11 Dark cursor packs included

---

What's New in v3.0

• ✅ 9 built-in UI themes – Light, Dark, Neon, Cherry, Blueberry, Stormy Morning, Desert Sunset, Coastal Fresh, Summer
• ✅ Custom Theme Engine – Create themes by editing all CSS color variables with live preview
• ✅ Clone any theme – Clone built-in or custom themes as a starting point
• ✅ Delete custom themes – One-click delete button appears below the dropdown when a custom theme is selected
• ✅ Export/import themes – Share themes as theme-Name.json files
• ✅ Hotspot saved per pack – Each pack independently remembers its own sync checkbox state and hotspot values; switching packs never bleeds settings across
• ✅ Built-in pack hotspot editing – Adjust hotspot on built-in packs without needing to clone them
• ✅ settings.json now includes custom themes – Your custom themes travel with your settings file
• ✅ Sandbox respects enable toggle – Disabling the extension shows the native browser cursor in the preview box

---

Installation

1. Clone or download this repository
2. Open Chrome/Edge and go to chrome://extensions (or edge://extensions)
3. Enable Developer mode (top-right corner)
4. Click Load unpacked and select the extension folder
5. The extension is now active!

---

How to Use

Configure Cursors

1. Click the extension icon and select Options
2. Go to the Library tab
3. Click a built-in pack to activate it, or click + Create empty pack to make your own
4. Upload PNG files for grab and grabbing cursors
5. Adjust hotspot coordinates (X, Y) for precise cursor alignment
6. Toggle "Use same hotspot for both cursors" for independent control
7. Changes apply instantly ✨

Cursor Packs

• Create – Start from scratch with an empty pack
• Clone – Duplicate any pack (including built-ins) to customize
• Import – Select a folder containing grab.png, grabbing.png, and info.json
• Export – Downloads a .zip with your pack's folder structure ready to share
• Reorder – Drag and drop pack cards to reorder them

Themes

• Select – Pick from 9 built-in themes in the Settings tab
• Clone – Click Clone theme to copy any built-in or custom theme into the editor
• Create – Click + Create theme to build one from scratch with live preview
• Delete – A Delete theme button appears below the dropdown when a custom theme is active
• Export – Saves the active custom theme as theme-Name.json
• Import – Load a theme .json file shared by someone else

Settings Export / Import

• Export (settings.json) – Saves theme, enable state, hotspot settings for all packs, and all custom themes
• Import (settings.json) – Restores everything; packs are matched by ID, cursor images are never overwritten

---

Hotspot Explained

The hotspot is the exact pixel point where the cursor registers. Default is (16, 16) — the center of a 32×32 cursor image.

• Sync mode (default): One setting controls both grab and grabbing cursors
• Separate mode: Fine-tune each cursor's hotspot independently
• Settings are saved per pack — switching packs always loads that pack's own values

---

How It Works

The extension uses a lightweight MutationObserver to detect grab cursors on page elements and replaces them with your custom images. It intelligently avoids interfering with:

• Default pointer cursors
• Generic draggable elements
• Other cursor types

Only elements explicitly using grab/grabbing cursors are affected.

---

Browser Support

• ✅ Chrome/Chromium (v90+)
• ✅ Microsoft Edge
• ✅ Other Chromium-based browsers

---

Credits

Developed by Yossof0
If you share or use this extension, please give credit to the original author.

• 📺 [YouTube – @OverClock33](https://www.youtube.com/@OverClock33)
• 🐙 [GitHub – Yossof0](https://github.com/Yossof0/)

---

License

Open source – feel free to modify and distribute (with attribution).

---

Happy customizing! 🎉

Custom Grab Cursor v1.1

Custom Grab Cursors v1.1

Overview

Transform any webpage's grab and grabbing cursors into stylish, customizable images with flexible hotspot positioning and elegant UI configuration.

Features

✨ Custom Cursor Images – Replace default grab/grabbing cursors with your own PNG images
🎯 Flexible Hotspot Control – Adjust cursor hotspot coordinates (0-32px) individually or sync both cursors
🎨 Theme Customization – Pick your own accent color for the settings page
⚡ One-Click Enable/Disable – Toggle the extension without uninstalling
💾 Instant Updates – Changes apply immediately to all open tabs
🔒 Safe & Lightweight – Only affects grab cursors, never hijacks pointer or default cursors

What's New in v1.1

• ✅ Individual hotspot controls for grab and grabbing cursors
• ✅ Toggle option to sync hotspots or customize separately
• ✅ Extension icon support (16px, 48px, 128px)
• ✅ Enhanced description and branding
• ✅ Improved settings UI with color sections and accent picker
• ✅ Better disable toggle for the entire extension

Installation

1. Clone or download this repository
2. Open Chrome/Edge and go to chrome://extensions (or edge://extensions)
3. Enable Developer mode (top-right corner)
4. Click Load unpacked and select the extension folder
5. The extension is now active!

How to Use

Configure Cursors

1. Right-click the extension icon
2. Select Options
3. Upload PNG files for grab and grabbing cursors
4. Adjust hotspot coordinates (X, Y) for precise cursor alignment
5. Toggle "Use same hotspot for both cursors" for independent control
6. Pick an accent color to personalize the settings page
7. Changes apply instantly ✨

Hotspot Explained

The hotspot is the exact pixel point where clicks register. Default is (16, 16) – the center of a 32×32 cursor.

• Sync mode (default): One setting controls both cursors
• Separate mode: Fine-tune each cursor independently

Customization Options

• Enable/Disable: Checkbox to toggle the entire extension
• Custom Images: Upload your own PNG files
• Hotspot X/Y: 0–32 pixels, individually or synced
• Accent Color: Color picker for UI styling
• Reset: Clear all settings and return to defaults

How It Works

The extension uses a lightweight MutationObserver to detect grab cursors on page elements and replaces them with your custom images. It intelligently avoids interfering with:

• Default pointer cursors
• Generic draggable elements
• Other cursor types

Only elements explicitly using grab/grabbing cursors (or marked with data-grab="true") are affected.

Browser Support

• ✅ Chrome/Chromium (v90+)
• ✅ Microsoft Edge
• ✅ Other Chromium-based browsers

Credits

Developed by Yossof0
If you share or use this extension, please give credit to the original author.

Release Notes

• Fixed issue where grab cursor was applied to all draggable elements
• Added individual hotspot support for grab vs grabbing states
• Improved settings UI with modern card-based layout
• Added extension icons
• Enhanced marketplace description

License

Open source – feel free to modify and distribute (with attribution).

---

Happy customizing! 🎉

Update V4

Custom Grab Cursors — v4

Replace every grab and grabbing cursor on the web with your own custom images. Works on virtually any site, instantly, with no page reload required.

---

What's New in v4

• Per-site rules — Disable the extension entirely or force a specific pack on any domain
• Full theme system — 15 built-in themes + custom theme editor with live preview
• Favorites & pinning — Star a pack to pin it to the top of the library
• Pack search — Filter your library by name or tags instantly
• Tag support — Label packs with comma-separated tags for easy organization
• Circular checkbox UI — Polished settings controls throughout
• Grabbing cursor fix — Cursor now correctly stays as grabbing when dragging out of an element and back in (both in sandbox and on real sites)
• Sandbox moved to Library tab — Live preview lives next to your packs where it belongs
• Hotspot inputs redesigned — Clean X/Y row layout, properly styled number inputs

---

Features

🗂️ Cursor Packs

• 3 built-in packs: Mac OS, Win11 Light, Win11 Dark
• Create unlimited custom packs with your own PNG cursors
• Clone any pack (built-in or custom) as a starting point
• Import packs from a folder (grab.png + grabbing.png + info.json)
• Export any pack as a .zip
• Drag cards to reorder your library
• Star one pack to keep it pinned at the top

🎯 Hotspot Control

• Sync hotspot: one X/Y pair for both cursors
• Separate hotspot: independent X/Y for grab and grabbing
• Applies per-pack — each pack remembers its own hotspot

🎨 Themes

• 15 built-in themes: Light, Dark, Neon, Cherry, Blueberry, Stormy, Desert, Coastal, Summer, Parchment, Aurora, Espresso, Graphite, Sakura, Toxic
• Theme editor: create fully custom themes with 6 color variables
• Clone any built-in or custom theme as a base
• Export/import custom themes as .json
• Theme is saved and restored across sessions

🔧 Per-site Rules

• Disable — turn the extension off completely for a domain
• Override — force a specific pack on a domain
• Subdomain-inclusive matching (e.g. youtube.com also matches www.youtube.com)
• First matching rule wins

🔬 Live Preview Sandbox

• Drag the sandbox box to test grab/grabbing cursors live
• Correctly shows grabbing cursor if you drag out and back in while holding

---

Installation

1. Download the latest release from GitHub Releases
2. Unzip the archive
3. Open Chrome and go to chrome://extensions/
4. Enable Developer mode (top right toggle)
5. Click Load unpacked and select the unzipped folder
6. Click the extension icon or go to its options page to configure

---

Creating a Custom Pack

1. Go to the Library tab → click + Create empty pack
2. Set a name and optional tags
3. Upload grab.png and grabbing.png (PNG only, SVG not supported)
4. Adjust hotspot X/Y to align the cursor tip correctly
5. Click Use on the card to activate it

Pack folder format (for import)

my-pack/
├── grab.png
├── grabbing.png
└── info.json

info.json example:

{
  "name": "My Pack",
  "syncHotspot": true,
  "hotspotX": 16,
  "hotspotY": 16
}

---

Cursor Image Guidelines

Property	Recommended
Format	PNG
Size	32×32 px or 64×64 px
Hotspot	Usually center (16, 16) or tip of cursor
Background	Transparent

SVG is not supported as a cursor format — convert to PNG first.

---

Settings Export / Import

The Export settings button (Settings tab) saves a .json snapshot of:

• Active theme
• Enable/disable state
• All pack hotspot configs, tags, and favorites
• Custom themes
• Per-site rules

Re-import it on any machine to restore your full setup instantly.

---

File Structure

CustomGrabCursors/
├── manifest.json
├── content.js          # Injected into every page
├── options.html        # Settings UI
├── options.js          # Settings logic
└── resources/
    ├── macos/
    │   ├── grab.png
    │   └── grabbing.png
    ├── win11-light/
    │   ├── grab.png
    │   └── grabbing.png
    ├── win11-dark/
    │   ├── grab.png
    │   └── grabbing.png
    └── unavailable.svg

---

Permissions

Permission	Why
storage	Saves packs, themes, hotspots, and rules locally
<all_urls> (content script)	Applies cursor replacement on every page

No data is ever sent anywhere. Everything stays in your browser's local storage.

---

Credits

Developed by Yossof0

• YouTube
• GitHub

Pre release v2.2

Custom Grab Cursors v2.2 (Pre-release)

Overview

Transform any webpage's grab and grabbing cursors into stylish, customizable images with flexible hotspot positioning, cursor pack management, and an elegant multi-theme UI.

---

Features

✨ Custom Cursor Images – Replace default grab/grabbing cursors with your own PNG images
🗂️ Cursor Packs – Create, clone, import and export full cursor packs as .zip folders
🎯 Flexible Hotspot Control – Adjust cursor hotspot coordinates individually or sync both cursors
🎨 Multiple UI Themes – Choose from Light, Dark, Neon, Cherry, and Blueberry themes
⚡ One-Click Enable/Disable – Toggle the extension without uninstalling
💾 Instant Updates – Changes apply immediately to all open tabs
🔒 Safe & Lightweight – Only affects grab cursors, never hijacks pointer or default cursors
📦 Settings Export/Import – Save and restore your theme, enable state, and pack settings via settings.json
⭐ Built-in Packs – Comes with Mac OS, Windows 11 Light, and Windows 11 Dark cursor packs out of the box

---

What's New in v2.2 (Pre-release)

• ✅ Hotspot editing for built-in packs – You can now adjust hotspot coordinates on built-in packs (Mac OS, Win11 Light, Win11 Dark) without needing to clone them first
• ✅ All other built-in pack properties (name, cursor images) remain protected and read-only

---

Installation

1. Clone or download this repository
2. Open Chrome/Edge and go to chrome://extensions (or edge://extensions)
3. Enable Developer mode (top-right corner)
4. Click Load unpacked and select the extension folder
5. The extension is now active!

---

How to Use

Configure Cursors

1. Click the extension icon and select Options
2. Go to the Library tab
3. Click a built-in pack to activate it, or click + Create empty pack to make your own
4. Upload PNG files for grab and grabbing cursors
5. Adjust hotspot coordinates (X, Y) for precise cursor alignment
6. Toggle "Use same hotspot for both cursors" for independent control
7. Changes apply instantly ✨

Cursor Packs

• Create – Start from scratch with an empty pack
• Clone – Duplicate any pack (including built-ins) to customize it
• Import – Select a folder containing grab.png, grabbing.png, and info.json
• Export – Downloads a .zip with your pack's folder structure ready to share
• Reorder – Drag and drop pack cards to reorder them

Settings Export / Import

• Export (settings.json) – Saves your current theme, enable state, and hotspot settings for all packs
• Import (settings.json) – Restores settings; only applies to packs that already exist, cursor images are never overwritten

---

Hotspot Explained

The hotspot is the exact pixel point where the cursor registers. Default is (16, 16) — the center of a 32×32 cursor image.

• Sync mode (default): One setting controls both grab and grabbing cursors
• Separate mode: Fine-tune each cursor's hotspot independently

---

How It Works

The extension uses a lightweight MutationObserver to detect grab cursors on page elements and replaces them with your custom images. It intelligently avoids interfering with:

• Default pointer cursors
• Generic draggable elements
• Other cursor types

Only elements explicitly using grab/grabbing cursors (or marked with data-grab="true") are affected.

---

Browser Support

• ✅ Chrome/Chromium (v90+)
• ✅ Microsoft Edge
• ✅ Other Chromium-based browsers

---

Credits

Developed by Yossof0
If you share or use this extension, please give credit to the original author.

• 📺 [YouTube – @OverClock33](https://www.youtube.com/@OverClock33)
• 🐙 [GitHub – Yossof0](https://github.com/Yossof0/)

---

License

Open source – feel free to modify and distribute (with attribution).

---

Happy customizing! 🎉