HEX・RGB・HSL・HSV/HSB・CMYKおよびCSS名前付きカラー間を即座に相互変換。カラーピッカーで選ぶか、任意のフォーマットで入力するだけで、すべての形式がリアルタイムに更新されます。補色の表示、ライター・ダーカーシェードの生成、各フォーマットのワンクリックコピーにも対応しています。
カラー変換ツール
選択中のカラー
補色
HEX
RGB
HSL
HSV
CMYK
CSS名—
明るい・暗いシェード （クリックで適用）
使い方
- カラーピッカーをクリックして色を選択するか、テキストボックスに任意のフォーマットで入力します。
- 対応入力フォーマット:
#rrggbb、#rgb、rgb(r, g, b)、hsl(h, s%, l%)、hsv(h, s%, v%)、cmyk(c%, m%, y%, k%)、または CSS名（例:coral、steelblue） - すべての出力フォーマットがリアルタイムに更新されます。
- 明るい・暗いシェードのブロックをクリックすると、そのシェードに切り替わります。
- 各フォーマットの右側にある コピー ボタンを押すと、クリップボードにコピーされます。
フォーマット一覧
| フォーマット | 例 | 主な用途 |
|---|---|---|
| HEX | #5B6AF0 | Web開発・デザインツール全般 |
| RGB | rgb(91, 106, 240) | CSS・Canvas・画像処理 |
| HSL | hsl(235, 82%, 65%) | CSSテーマ・直感的な色調整 |
| HSV/HSB | hsv(235, 62%, 94%) | Photoshop・Illustratorのカラーピッカー |
| CMYK | cmyk(62%, 56%, 0%, 6%) | 印刷デザイン・入稿データ作成 |
| CSS名 | cornflowerblue | CSSの省略記法 |
関連ツール
- カラーピッカー — スポイト機能とパレットビルダー
- カラーパレットジェネレーター — 調和の取れたカラーパレットを自動生成
- カラーコントラストチェッカー — WCAGアクセシビリティのコントラスト比を確認
freee会計との連携でデザイン業務をもっとスムーズに
デザイン制作の請求書・経費管理でお困りではありませんか？ freee会計 を使えば、クライアントごとの請求書発行・経費の自動仕訳・確定申告まで一括管理できます。フリーランスのデザイナーや小規模事務所にも最適です。