Cursor preview: Dog - 1 - cute-cursor.com

Cursor pack

Dog

Cute PetsAdded 307 times

Dog cursor for Chrome - themed custom pointer with matching hover hand. Chrome cursor fan art.

Add to Extension

The Animals Cursor Collection offers a cute and playful dog cursor for your browser. With its adorable design, your cursor will be sure to catch the eye of anyone who sees it. This cursor is perfect for dog-lovers and anyone looking to add a bit of fun to their browsing experience. From playful puppies to loyal companions, dogs have a special place in our hearts and this cursor is just one way to show our love for these furry friends. So add a little wag to your cursor with the dog cursor from the Animals Cursor Collection.

Cursor files

Download the file or copy ready-to-use CSS, JavaScript, React, and Roblox code with the correct hotspot.

Cursor - 1 - cute-cursor.com

Cursor

Download the file or copy embed code for your website, React, JavaScript, or Roblox.

Paste this CSS into your stylesheet. Hotspot coordinates are already included.

.custom-cursor {
  cursor: url('https://cute-cursor.com/cdn/packs/10217/arrow.png') 3 1, auto;
}

Paste this JavaScript to apply the cursor with the correct hotspot.

const CURSOR_URL = 'https://cute-cursor.com/cdn/packs/10217/arrow.png';
const HOTSPOT_X = 3;
const HOTSPOT_Y = 1;
const CURSOR_FALLBACK = 'auto';

const cursorValue = `url('${CURSOR_URL}') ${HOTSPOT_X} ${HOTSPOT_Y}, ${CURSOR_FALLBACK}`;

// Apply to the whole page
document.body.style.cursor = cursorValue;

// Or apply to a specific element
// const target = document.querySelector('.my-element');
// if (target) target.style.cursor = cursorValue;

Copy this React component and wrap your content with it.

import React from 'react';

const CURSOR_URL = 'https://cute-cursor.com/cdn/packs/10217/arrow.png';
const HOTSPOT_X = 3;
const HOTSPOT_Y = 1;
const CURSOR_FALLBACK = 'auto';

export default function CustomCursor({ children, className = '', as: Tag = 'div', style = {}, ...props }) {
  const cursorStyle = {
    cursor: `url('${CURSOR_URL}') ${HOTSPOT_X} ${HOTSPOT_Y}, ${CURSOR_FALLBACK}`,
    ...style,
  };

  return (
    <Tag className={className} style={cursorStyle} {...props}>
      {children}
    </Tag>
  );
}

// Usage:
// <CustomCursor>Your content</CustomCursor>

Upload the image to Roblox, replace YOUR_ASSET_ID, then paste this LocalScript.

-- Roblox custom cursor
-- Image URL: https://cute-cursor.com/cdn/packs/10217/arrow.png
-- Hotspot: 3, 1
-- Size: 128x128
-- 1. Upload the image to Roblox and copy rbxassetid
-- 2. Replace YOUR_ASSET_ID below
-- 3. Put this LocalScript in StarterPlayer > StarterPlayerScripts

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

local player = Players.LocalPlayer
local playerGui = player:WaitForChild("PlayerGui")

local HOTSPOT_X = 3
local HOTSPOT_Y = 1
local CURSOR_WIDTH = 128
local CURSOR_HEIGHT = 128

local screenGui = Instance.new("ScreenGui")
screenGui.Name = "CustomCursorGui"
screenGui.ResetOnSpawn = false
screenGui.IgnoreGuiInset = true
screenGui.DisplayOrder = 999999
screenGui.Parent = playerGui

local cursor = Instance.new("ImageLabel")
cursor.Name = "CustomCursor"
cursor.BackgroundTransparency = 1
cursor.Size = UDim2.fromOffset(CURSOR_WIDTH, CURSOR_HEIGHT)
cursor.Image = "rbxassetid://YOUR_ASSET_ID"
cursor.ZIndex = 999999
cursor.Parent = screenGui

UserInputService.MouseIconEnabled = false

RunService.RenderStepped:Connect(function()
    local mouseLocation = UserInputService:GetMouseLocation()
    cursor.Position = UDim2.fromOffset(mouseLocation.X - HOTSPOT_X, mouseLocation.Y - HOTSPOT_Y)
end)
Pointer - 2 - cute-cursor.com

Pointer

Download the file or copy embed code for your website, React, JavaScript, or Roblox.

Paste this CSS into your stylesheet. Hotspot coordinates are already included.

.custom-pointer {
  cursor: url('https://cute-cursor.com/cdn/packs/10217/hand.png') 30 3, pointer;
}

Paste this JavaScript to apply the cursor with the correct hotspot.

const CURSOR_URL = 'https://cute-cursor.com/cdn/packs/10217/hand.png';
const HOTSPOT_X = 30;
const HOTSPOT_Y = 3;
const CURSOR_FALLBACK = 'pointer';

const cursorValue = `url('${CURSOR_URL}') ${HOTSPOT_X} ${HOTSPOT_Y}, ${CURSOR_FALLBACK}`;

// Apply to the whole page
document.body.style.cursor = cursorValue;

// Or apply to a specific element
// const target = document.querySelector('.my-element');
// if (target) target.style.cursor = cursorValue;

Copy this React component and wrap your content with it.

import React from 'react';

const CURSOR_URL = 'https://cute-cursor.com/cdn/packs/10217/hand.png';
const HOTSPOT_X = 30;
const HOTSPOT_Y = 3;
const CURSOR_FALLBACK = 'pointer';

export default function CustomPointer({ children, className = '', as: Tag = 'div', style = {}, ...props }) {
  const cursorStyle = {
    cursor: `url('${CURSOR_URL}') ${HOTSPOT_X} ${HOTSPOT_Y}, ${CURSOR_FALLBACK}`,
    ...style,
  };

  return (
    <Tag className={className} style={cursorStyle} {...props}>
      {children}
    </Tag>
  );
}

// Usage:
// <CustomPointer>Your content</CustomPointer>

Upload the image to Roblox, replace YOUR_ASSET_ID, then paste this LocalScript.

-- Roblox custom cursor
-- Image URL: https://cute-cursor.com/cdn/packs/10217/hand.png
-- Hotspot: 30, 3
-- Size: 128x128
-- 1. Upload the image to Roblox and copy rbxassetid
-- 2. Replace YOUR_ASSET_ID below
-- 3. Put this LocalScript in StarterPlayer > StarterPlayerScripts

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

local player = Players.LocalPlayer
local playerGui = player:WaitForChild("PlayerGui")

local HOTSPOT_X = 30
local HOTSPOT_Y = 3
local CURSOR_WIDTH = 128
local CURSOR_HEIGHT = 128

local screenGui = Instance.new("ScreenGui")
screenGui.Name = "CustomCursorGui"
screenGui.ResetOnSpawn = false
screenGui.IgnoreGuiInset = true
screenGui.DisplayOrder = 999999
screenGui.Parent = playerGui

local cursor = Instance.new("ImageLabel")
cursor.Name = "CustomCursor"
cursor.BackgroundTransparency = 1
cursor.Size = UDim2.fromOffset(CURSOR_WIDTH, CURSOR_HEIGHT)
cursor.Image = "rbxassetid://YOUR_ASSET_ID"
cursor.ZIndex = 999999
cursor.Parent = screenGui

UserInputService.MouseIconEnabled = false

RunService.RenderStepped:Connect(function()
    local mouseLocation = UserInputService:GetMouseLocation()
    cursor.Position = UDim2.fromOffset(mouseLocation.X - HOTSPOT_X, mouseLocation.Y - HOTSPOT_Y)
end)
100% Free

Get the Cursor Changer extension

Free for Chrome. Install once, then click Add on any cursor you like.

Install to Chrome