自定义 CSS 光标生成器

将表情符号或图片转换为 CSS 鼠标光标,调整其锚点(热点)并在复制代码前实时测试效果。100% 在您的浏览器中本地处理——不向任何服务器发送内容。

示例:

工作原理

CSS 属性 cursor 接受一张图片(url(...))、一个可选的像素锚点,以及在图片无法加载时使用的备用关键词。该工具在浏览器中直接将您的表情符号或图片编码为 data URL,然后组成完整的 CSS 声明,可直接粘贴到您的样式表中。

锚点(热点)有什么用?

锚点定义了图片中哪个像素精确对应点击的位置。对于靶心或箭头形状的光标,通常将锚点放在图片的中心或尖端,以确保点击发生在视觉上正确的位置。

为什么有些浏览器会忽略我的自定义光标?

大多数浏览器将自定义光标的尺寸限制在约 128 像素以内,如果图片过大或格式不受支持,会回退到备用光标;建议使用轻量的方形图片(PNG 或 SVG)和合理的尺寸,以在所有浏览器上获得可靠的显示效果。

您的图片和表情符号都不会被传输到任何地方:所有编码都在您浏览器的内存中本地完成。