HEX と RGB を見比べながら色指定を整える
デザインと実装のあいだでは、HEXとRGBのどちらで色を渡すかが混在しがちです。DragKitはライブプレビュー付きで値を相互変換し、CSS用の確認にも使えます。
相互変換
HEXからRGB、RGBからHEXへその場で切り替えられます。
ライブプレビュー
入力した色がその場で表示されるので、確認しながら値を整えられます。
CSS確認にも便利
HSLやCSS値もまとめて見られるため、実装に渡す前のチェックに向いています。
使い方
- 色コードを入力 - HEXまたはRGBの値を入力して変換を始めます。
- 結果を確認 - ライブプレビューで色味を見ながら値を整えます。
- 必要な形式をコピー - HEX、RGB、HSL、CSSの必要な値を使います。
よくある用途
- CSS色指定の確認
- デザインと実装の色合わせ
- ブランドカラーの形式変換
FAQ
HEXとRGBはどちらを使えばいいですか?
CSSではどちらも使えます。チームの運用やデザインツールに合わせて選ぶのが実用的です。
HSLも確認できますか?
はい。ページ上でHSL値も確認できます。