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 :]

271 Kudos

Comments

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

S ý b ï L	1765564186 this was so helpful! Thank you SO mucH!! Report Comment
shxrry_ksh	1762528583 this helped me a lot, thank you!! Report Comment
lexy	1760971567 thanks!! Report Comment
spoon	1760232887 thank you a ton! Report Comment
Andrés	1756930949 Thank you so muchh! Report Comment
Roni	1756483936 THANK YOU!!! :D Report Comment
𐌔𐌀𐌌꩜ .ᐟ	1755028564 its not working but im probably doing something wrong:( Report Comment u can try this https://blog.spacehey.com/entry?id=895273 by Adham; 1755217463; Report
ONO	1754914854 THANK YOU :DDDDDD Report Comment
⋆.˚✮ AJ ✮˚.⋆	1751635176 THIS IS INCREDIBLE THANK YOUUU Report Comment
christinacrucifix	1749874474 THANXXXX XO Report Comment
★Anaa Carolina!!	1746986765 THANK YOUU <3 Report Comment
39_melodreams	1742786648 thank youuuuuu :P Report Comment
jannie 𝄞	1741379703 THANX!! Report Comment
♯ 🍋⸝⸝ @xx.royzz ─ ✿	1739966790 THANK YEUU >.< u saved mah profile xdd Report Comment
corentin	1739438018 Thank you for this tutorial, and thank you for quoting me, I hope you liked the custom cursors on my profile :D Report Comment
Winniethedoggie	1738370516 thank you! Report Comment
Maximyst	1737998735 Tysm this really helped!!! (/◕ヮ◕)/ Report Comment
soph!(wip)	1736184982 does anyone know how to make the cursor change while hovering over something? Report Comment in standard html it'd be something upon these lines: .cursor:hover { cursor: pointer; (or whatever you want to change it too !!!) } by jess; 1738098978; Report
Grechka	1734428126 TYSM!!! Report Comment
myaa ✶⋆.˚	1733456285 omg tysm you save my life! Report Comment