Change your cursor into an Emoji Cursor or Image Cursor

cursor

Change your cursor into an Emoji Cursor or Image Cursor Demo

View Demo Full Screen View Demo New Tab

Change your cursor into an Emoji Cursor or Image Cursor Code

HTML

<div class='box-wrap'>
  <div class='dbox pink-bg cursor-wait'>Wait!</div>
  <div class='dbox blue-bg cursor-emoji'>Emoji Cursor... Mmm Coffee</div>
  <div class='dbox orange-bg cursor-image'>Image Cursor</div>
</div>

CSS

.box-wrap {
  display: flex;
  height: 100vh;
  align-items: center;
  justify-content: center;
}
.dbox {
  	display: flex;
    align-items: center;
    justify-content: center;
	height:200px;
  	width:200px;
  	border-radius:10px;
  	margin-right:10px;
  	box-shadow:0px 1px 2px #000;
  	color:#FFF;
  	text-shadow:0px 1px 2px #000;
}
.pink-bg {
  background:pink;
}
.blue-bg {
  background:blue;
}
.orange-bg {
  background:orange;
}
.cursor-wait {
	cursor:wait;
}
.cursor-emoji {
	cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'  width='40' height='48' viewport='0 0 100 100' style='fill:black;font-size:24px;'><text y='50%'>☕</text></svg>"), auto;
}
.cursor-image {
	cursor: url(https://picsum.photos/20/20), auto;
}