CSSの cursor プロパティで使える全カーソル値を一覧で確認。カードにホバーしてカーソルをプレビューし、ボタンをクリックしてCSSをコピーできます。検索・カテゴリーで絞り込みも可能。カスタムカーソルのCSS生成ツールも内蔵しています。

⚙ カスタムカーソル CSS ジェネレーター
カーソルプレビュー
ここにホバーしてカーソルを確認
/* 画像をアップロードするとCSSが生成されます */

フリーランス・個人事業主の方へ：会計をもっとラクに

Webデザイン・フロントエンド案件の請求書・経費管理は freee でまとめて自動化。確定申告もかんたんに。

freee を無料で試す

CSSカーソルの使い方

cursor プロパティは任意の要素に設定できます：

/* キーワード指定 */
.btn { cursor: pointer; }

/* カスタム画像カーソル */
.custom { cursor: url('/cursors/my-cursor.png') 0 0, auto; }

カスタムカーソルは url() の後にホットスポット座標（クリック判定位置）を x y の順で指定し、最後にキーワード（auto や pointer など）をフォールバックとして書きます。

ブラウザ対応

上記のすべてのキーワード値は Chrome・Firefox・Safari・Edge の最新版でサポートされています。カスタム URL カーソルは PNG・SVG・ICO 形式に対応しており、推奨最大サイズは 128×128 px です。

関連ツール： CSSアニメーションジェネレーター  |  CSSボタンジェネレーター

確定申告・会計をもっとラクに？ freee会計 なら、フリーランスの経費管理もクラウドで簡単。まずは無料で試してみましょう。