カラーフォーマット早見表
| フォーマット | 例 | 最適な用途 |
|---|---|---|
| HEX | #3B82F6 | CSSとデザインハンドオフ |
| RGB | rgb(59, 130, 246) | プログラムによる色操作とブラウザレンダリング |
| HSL | hsl(217, 91%, 60%) | 直感的な色相・彩度・明度の調整 |
| CMYK | cmyk(76, 47, 0, 4) | 印刷向けワークフロー |
同じ青を異なる形式で
HEX
#3B82F6
RGB
rgb(59, 130, 246)
HSL
hsl(217, 91%, 60%)
CMYK
cmyk(76, 47, 0, 4)
使い分け
- デザインシステムやスタイルシートで、CSSに適した短い値が必要な場合はHEXを使用します。
- コードやブラウザAPIがチャンネル値を直接要求する場合はRGBを使用します。
- 明度や彩度をより直感的に変更したい場合はHSLを使用してください。
- 印刷向けの会話ではCMYKを使用し、CSSの主要な形式としては使用しないでください。
適切なツールと一緒にこのリファレンスを使用してください
関連ツール