Anteprima cursore: Sapphire Gem Smile - 1 - cute-cursor.com

Pack di cursori

Sapphire Gem Smile

Gem TexturesAggiunto 1 volte

Sapphire Gem Smile custom cursor with bright sapphire crystal facets, a kawaii smile, and a matching gem pointing hand.

Aggiungi all'Estensione

Sapphire Gem Smile Custom Cursor Pack

Sapphire Gem Smile is a bright sapphire gem cursor pack with low-poly crystalline facets, electric cyan-blue polish, and cute kawaii faces on both the arrow and the pointing hand. Sharp specular highlights keep the crystal look crisp while the smile stays soft and friendly.

Use this custom cursor in Chrome or Edge to give your desktop a jewel-bright sapphire glow. The pack also works on Windows 10/11, so you can switch between the faceted arrow and the gem hand pointer for everyday browsing.

Fan-made gem texture art inspired by crystalline cursor styles - not affiliated with any trademarked brand. Explore more sparkle in Gem Textures or browse related sparkle looks like Sunrise Crystal Bean.

Download Sapphire Gem Smile free, preview the hover hand, and pair it with other gem packs when you want a cyan-blue crystal theme.

File del cursore

Scarica il file o copia il codice CSS, JavaScript, React e Roblox pronto all'uso con l'hotspot corretto.

Cursore - 1 - cute-cursor.com

Cursore

Scarica il file o copia il codice di incorporamento per il tuo sito web, React, JavaScript o Roblox.

Incolla questo CSS nel tuo foglio di stile. Le coordinate dell'hotspot sono già incluse.

.custom-cursor {
  cursor: url('https://cute-cursor.com/cdn/packs/146298/arrow.png') 26 5, auto;
}

Incolla questo JavaScript per applicare il cursore con l'hotspot corretto.

const CURSOR_URL = 'https://cute-cursor.com/cdn/packs/146298/arrow.png';
const HOTSPOT_X = 26;
const HOTSPOT_Y = 5;
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;

Copia questo componente React e avvolgi il tuo contenuto con esso.

import React from 'react';

const CURSOR_URL = 'https://cute-cursor.com/cdn/packs/146298/arrow.png';
const HOTSPOT_X = 26;
const HOTSPOT_Y = 5;
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>

Carica l'immagine su Roblox, sostituisci YOUR_ASSET_ID, quindi incolla questo LocalScript.

-- Roblox custom cursor
-- Image URL: https://cute-cursor.com/cdn/packs/146298/arrow.png
-- Hotspot: 26, 5
-- 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 = 26
local HOTSPOT_Y = 5
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)
Puntatore - 2 - cute-cursor.com

Puntatore

Scarica il file o copia il codice di incorporamento per il tuo sito web, React, JavaScript o Roblox.

Incolla questo CSS nel tuo foglio di stile. Le coordinate dell'hotspot sono già incluse.

.custom-pointer {
  cursor: url('https://cute-cursor.com/cdn/packs/146298/hand.png') 33 6, pointer;
}

Incolla questo JavaScript per applicare il cursore con l'hotspot corretto.

const CURSOR_URL = 'https://cute-cursor.com/cdn/packs/146298/hand.png';
const HOTSPOT_X = 33;
const HOTSPOT_Y = 6;
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;

Copia questo componente React e avvolgi il tuo contenuto con esso.

import React from 'react';

const CURSOR_URL = 'https://cute-cursor.com/cdn/packs/146298/hand.png';
const HOTSPOT_X = 33;
const HOTSPOT_Y = 6;
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>

Carica l'immagine su Roblox, sostituisci YOUR_ASSET_ID, quindi incolla questo LocalScript.

-- Roblox custom cursor
-- Image URL: https://cute-cursor.com/cdn/packs/146298/hand.png
-- Hotspot: 33, 6
-- 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 = 33
local HOTSPOT_Y = 6
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% Gratis

Ottieni l'estensione Cursor Changer

Gratis per Chrome. Installa una volta, poi clicca su Aggiungi sul cursore che preferisci.

Installa su Chrome