Published by wesker

published 1657892866
updated 1657894251

Category: Web, HTML, Tech

View Blog View Profile Report Blog Entry

CUSTOM CURSORS - A GUIDE YOU CAN TRUST !

ive been messing around with cursors for a while and struggled insanely, so i'm here to explain how to get your cursor working !

the following explains adding your own cursor, where to get cursors, cursor code, animated cursors & common errors.

the tutorial points are started with "-", if you're here new rather than to fix your cursor!

your cursor input uses a url starting with "http://"

spacehey only works with urls that use https! a popular site many are using is rw-designer; this isn't compatible with spacehey.

- some really good working alternatives include https://www.cursors-4u.com & https://www.totallyfreecursors.com. on cursors-4u use option 1 when copying & put it at the top of your profile code

you want to use an animated cursor

internet explorer supports animated cursors, as it chooses to, but chrome, firefox etc. do not support these and will instead only display the first frame as a workaround.

- HOWEVER there is a way using keyframes! [click here] (credit to sodimel ^_^)

you missed the style tags out

make sure to put <style> ... </style> around your code! 7 times out of 10 it'll fix your problem

you want to add your own cursor

if you haven't made your own already, hop on a pixel art program & get creating! make sure your cursor is saved in .png or .cur format! the resolution can't exceed 128x128.

you can use https://convertio.co/ to convert a file to .cur !

upload it as a publicly accessible file on your preferred cloud/cdn (dropbox, onedrive, etc) and use that link in the cursor tag !

<style>

cursor: url(REPLACE ME WITH A HTTPS:// URL!), auto;

</style>

i believe discord file links will also work,,

alt example code - nyan cat:

source: cursors-4u.com

i give up! just give me a cursor!

well :^) if it's still not working, i think you may enjoy this:

<style>

body{

cursor: crosshair;

}

</style>

comment if there's anything i should add, something here doesn't work or you just need more help!

& perhaps leave kudos if this helped a little :]

111 Kudos

Comments

Displaying 20 of 22 comments ( View all | Add Comment )

charlii	1732807965 heyy! for anyone using cursors4u.com, you DO NOT have to use the code in the blog post! all you need to do is select the cursor you want, scroll down and then you'll see the "Universal CSS/HTML code" you can copy and paste that code into your bio! it worked for me :) have a great day <3 Report Comment that worked! love you for that by Karim; 1733045403; Report yw! by charlii; 1733144477; Report
𝑏𝑟𝑖𝑎𝑛𝑎	1732559850 one thing to note here is i tried to use the codes from cursors4u but when you paste it in your "about me" it doesn't work. instead of placing it there, try it under "who i'd like to meet" then it will work! just figured that out now for myself so try that guys! :3 Report Comment
xxbellabloodmoonxx	1730947529 heyyy every1!! if it doesn't work for u then try dis! x3 <style> body { cursor: url("https://cdn.imgchest.com/files/g4z9cpwexb7.png"), auto; } </style> it should work with a .png and if ur lookin for a site to upload it to then imgchest.com works gr8!!! Report Comment thanks!! by dave; 1733170810; Report
jaz	1728722977 It's still not working, I've got everything right I think ?? cursor: url(https://www.dropbox.com/scl/fi/4pgo5g255nyebalu7m9xe/mantis.cur?rlkey=kos54yam6negtyx3mxppfxft4&st=9bpdvr74&dl=0), auto; It's supposed to be a little mantis reaching up towards wherever you're pointing;-; Report Comment cursor: url(https://i.postimg.cc/XJWbL2tf/mantis.png), auto; Tried it as a png and it's still not working ;--; by jaz; 1728723115; Report Yes I included the style but it's not showing up in my comments by jaz; 1728723142; Report
𝔅𝔧𝔬̈𝔯𝔫	1728198318 my custom cursor is way lower than where i have it pointed :( Report Comment
ren	1727640589 bro is literally an angel THANK YOU SO MUCH Report Comment
ren	1727640586 bro is literally an angel THANK YOU SO MUCH Report Comment
Ryan!	1726786799 TYSM USEDDDD :3 Report Comment
Tom	1722469258 totally saved me dude, thx Report Comment
multiply⋆⋆⋆⋆	1722324106 how people make double cursor?? Report Comment help!! by multiply⋆⋆⋆⋆; 1722324116; Report
𝙨𝙘𝙖𝙣𝙣𝙞𝙣𝙜 𝙘𝙤𝙙𝙚...❱ http:˚♡evangeline ˚ˑؘ	1721453027 tysm this helped me after two hours of freestyling Report Comment
Alyssa	1717170718 Im trying to use my own png for my cursor but the only code that has been working is the nyan cat one, can you explain how to coded that one so I could change it for mine please Report Comment
xuntara	1715363310 OMG TYSM Report Comment
TheOneAndOnly	1714108660 thanku boss Report Comment
jakobdied	1712257570 THANKS SO MUCH!! Report Comment
kal xoxo	1708347154 tyyy Report Comment
LucidJelly	1690098730 THANKK YOUU ^^!! Report Comment
Raine-Bow->	1689095763 How do I use the keyframes? Report Comment
Raine-Bow->	1689095635 This actually worked! Thank you~ Report Comment
HelloKittys' Trash	1686423278 thanks it really helped :]] Report Comment