カラーツール
無料のオンラインカラーユーティリティ
無料ブラウザベースのカラーツールで色をより効果的に扱いましょう。HEX、RGB、HSL間の変換、調和のとれたカラーパレットの生成、CSSグラデーションの視覚的作成、アクセシビリティのためのコントラスト比チェック、画像からの色抽出、色覚異常シミュレーションまで対応しています。
Utilzカラーツールを使う理由
- コピー可能な出力 -- HEX、RGB、HSL、CSSコードをスタイルシートやデザインファイルに直接ペーストできます。
- アクセシビリティ重視 -- コントラストチェッカーはWCAG 2.1ガイドラインに準拠し、アクセシブルなデザインを支援します。
- 視覚的でインタラクティブ -- インタラクティブなピッカー、スライダー、リアルタイムのグラデーションプレビューで色の変化を即座に確認。
HEX⇔RGB変換
カラーコードを変換します
カラーパレット生成
カラーパレットを生成します
CSSグラデーション生成
CSSグラデーションを作成します
コントラストチェッカー
色のコントラスト比を確認します
画像カラーピッカー
画像から色を抽出します
色名検索
色の名前を調べます
Tailwindカラー検索
Tailwind CSSの色を検索します
色覚シミュレーター
色覚特性をシミュレーションします
よくある質問
対応するカラーフォーマットは?
HEX(3、6、8桁)、RGB、RGBA、HSL、HSLA、CSSネームドカラーに対応しています。変換ツールですべてのフォーマット間を即座に切り替え可能です。
コントラストチェッカーの仕組みは?
WCAG 2.1基準に従い、前景色と背景色の輝度比を計算します。通常テキストと大きなテキスト両方のAA・AAA基準の適合状況を表示します。