カスタムカーソルジェネレーター（CSS）

カスタムカーソルジェネレーター（CSS）: 用途

カスタムカーソルは、ポートフォリオ、ブランドサイト、ゲームの個性を引き立てます。好きな色とサイズの円（リング、塗りつぶし、点付きのリング）を選ぶか、PNGまたはSVGの画像を送り、クリック位置を決めて、テスト領域で試してください。

CSSは、data URIの画像、ホットスポット、代替カーソル、リンクとボタンで手の形を残すオプション付きで出力されます。画像が128 pxを超えると、ブラウザがカーソルを無視するため、ツールが警告します。

使い方

1. 円か画像を選びます。
2. 色、サイズ、クリック位置を調整します。
3. テストして、CSSをコピーします。

使うタイミング

• デザイナーのポートフォリオ。
• ブランドサイトやキャンペーン。
• ゲームのページ。

よくある質問

カーソルの最大サイズは？

ブラウザは、128×128 pxまでのカーソル画像に対応しています。それを超えると、画像を無視して代替カーソルを使います。最も安全で使いやすいサイズは32 pxです。

クリック位置（ホットスポット）とは何ですか？

画像のうち、カーソルの先端として扱われるピクセルです。矢印なら先端、円なら中心です。CSSで画像のアドレスのあとに続く2つの数値が、この位置です。

カスタムカーソルは操作の妨げになりますか？

小さすぎる、コントラストがない、クリック位置がずれている場合は、妨げになることがあります。個性の強いサイト（ポートフォリオ、ゲーム、ブランド）で使い、リンクには必ず手の形などのカーソルを残して、クリックできることを示してください。

本当に無料？

はい、100%無料です。登録不要、サブスクなし、利用制限なし。すべてのツール：Tools123は無料です。

関連ツール