Google Chrome

Rainbow Gradient custom cursor

Drop the Rainbow Gradient cute cursor - a free custom cursor for your desktop.

✨ Move your mouse to test both cursors
Arrow Cursor

Default navigation pointer

Pointer Cursor

Used for clickable elements

Hover over each side to preview both cursor styles in real-time.

1,000+

Rainbow Gradient Custom Cursor Pack

Drop Rainbow Gradient on your pointer, a lively cute cursor ready for tabs and scrolls. This free custom cursor works in Chrome and Edge, and on Windows 10/11 with Custom Cursor for the same tip outside the browser.

Rounded, tidy details keep Rainbow Gradient clear without crowding the pointer. It is fan-made cursor art inspired by gradient vibes - not an official brand product.

Continue the color wash with the Summer Gradient Cursor Pack, the Black and Peach Stroke Gradient Cursor Pack, and the Frozen Fog Gradient Cursor Pack.

Grab the Rainbow Gradient cursor and bring blend fun to every scroll.

Customize your embed code and preview it in real time below.

Live preview

PNG, resized to 32px
<style type="text/css">
body {
  cursor: url(https://cdn.cutecursors.com/cdn-sweezy/packs/rainbow-gradient-cursor/arrow.png) 4 4, auto;
}
a, button, .clickable {
  cursor: url(https://cdn.cutecursors.com/cdn-sweezy/packs/rainbow-gradient-cursor/hand.png) 4 4, pointer;
}
</style>
<a href="https://cutecursors.com//category/gradient/rainbow-gradient-cursor" title="Get free Rainbow Gradient cursors for your website.">
  Rainbow Gradient Cursors
</a>
/* components/CuteCursor.jsx */
"use client";
import { useEffect } from "react";

const CURSOR = "https://cdn.cutecursors.com/cdn-sweezy/packs/rainbow-gradient-cursor/arrow.png";
const POINTER = "https://cdn.cutecursors.com/cdn-sweezy/packs/rainbow-gradient-cursor/hand.png";

export default function CuteCursor() {
  useEffect(() => {
    const style = document.createElement("style");
    style.innerHTML = `
      body { cursor: url(${CURSOR}) 4 4, auto; }
      a, button, .clickable { cursor: url(${POINTER}) 4 4, pointer; }
    `;
    document.head.appendChild(style);
    return () => style.remove();
  }, []);

  return null;
}

/* Usage: render <CuteCursor /> once, e.g. in your root layout or App:
   <CuteCursor />
   Rainbow Gradient cursors by https://cutecursors.com//category/gradient/rainbow-gradient-cursor */
-- Rainbow Gradient custom cursor for Roblox
-- LocalScript (place it in StarterPlayer > StarterPlayerScripts)
--
-- 1) Download the cursor images (buttons above) or grab them here:
--    Cursor:  https://cdn.cutecursors.com/cdn-sweezy/packs/rainbow-gradient-cursor/arrow.png
--    Pointer: https://cdn.cutecursors.com/cdn-sweezy/packs/rainbow-gradient-cursor/hand.png
-- 2) Upload them in Roblox Creator Hub as Decals (Create > Decals).
-- 3) Replace the IDs below with your uploaded Image asset IDs.

local UserInputService = game:GetService("UserInputService")
local Players = game:GetService("Players")

local CURSOR_ICON = "rbxassetid://CURSOR_ASSET_ID"
local POINTER_ICON = "rbxassetid://POINTER_ASSET_ID"

-- Set the default cursor
UserInputService.MouseIcon = CURSOR_ICON

-- Optional: switch to the pointer icon while hovering GUI buttons
local function hookButton(button)
	button.MouseEnter:Connect(function()
		UserInputService.MouseIcon = POINTER_ICON
	end)
	button.MouseLeave:Connect(function()
		UserInputService.MouseIcon = CURSOR_ICON
	end)
end

local playerGui = Players.LocalPlayer:WaitForChild("PlayerGui")
for _, gui in ipairs(playerGui:GetDescendants()) do
	if gui:IsA("GuiButton") then
		hookButton(gui)
	end
end
playerGui.DescendantAdded:Connect(function(gui)
	if gui:IsA("GuiButton") then
		hookButton(gui)
	end
end)

-- Rainbow Gradient cursors: https://cutecursors.com//category/gradient/rainbow-gradient-cursor

How to Install Rainbow Gradient cursors

How to Install cursor Rainbow Gradient for Chrome

Rainbow Gradient preview

Rainbow Gradient

Drop the Rainbow Gradient cute cursor - a free custom cursor for your desktop.

  1. 1
    Go to Chrome Web Store

    Hit the 'Add to Browser' button to get the 'Rainbow Gradient' pack.

  2. 2
    Add the Extension

    On the Chrome Web Store, smash that ‘Add to Chrome’ button and confirm.

  3. 3
    Pin for Easy Access

    Pro-tip: Pin the 'Cute Cursors' extension to your toolbar for quick access.

  4. 4
    Activate Your Cursor

    Open the extension, find the 'Rainbow Gradient' pack, and click to activate. Easy peasy!

Piece of cake, right? Go on and have fun!

You may also like

Explore other cursor packs from our collection

Transparent & Rainbow Stroke Gradient Cursor-Paket

Transparent & Rainbow Stroke Gradient Cursor-Paket

Install the Transparent and Rainbow Stroke Gradient cute cursor - free custom cursor packed with vibe.

White & Rainbow Stroke Gradient Cursor-Paket

White & Rainbow Stroke Gradient Cursor-Paket

White and Rainbow Stroke Gradient cute cursor download - free custom cursor for everyday clicks.

Green & Blue Stroke Gradient Cursor-Paket

Green & Blue Stroke Gradient Cursor-Paket

Free custom cursor: Green and Blue Stroke Gradient cute cursor with a glossy gradient look.

Black & Rainbow Stroke Gradient Cursor-Paket

Black & Rainbow Stroke Gradient Cursor-Paket

Black and Rainbow Stroke Gradient free custom cursor - cute cursor flair for gradient fans.

Flamingo Pink Gradient Cursor-Paket

Flamingo Pink Gradient Cursor-Paket

Pick Flamingo Pink Gradient cute cursor - a free custom cursor with fade charm.

Blue & Orange Gradient Cursor-Paket

Blue & Orange Gradient Cursor-Paket

Blue and Orange Gradient cute cursor for fans - free custom cursor with soft charm.

Tropical Sea Gradient Cursor-Paket

Tropical Sea Gradient Cursor-Paket

Tropical Sea Gradient: cute cursor pack and free custom cursor for gradient fans.

Orange Gradient Cursor-Paket

Orange Gradient Cursor-Paket

Orange Gradient cute cursor pack: free custom cursors with color-blend style.

Didn't Find Your Vibe?

Our universe of cursors is huge. Dive into hundreds of unique collections and find the one that truly represents you.

Explore All Collections