色を生成
新しいランダムカラーを押して3つのRGBチャンネルを安全に生成します。
ランダムカラー
自分では選ばなかった色を見つけよう。
新しい色を作り、一般的なコード形式をコピーし、明るい文字と暗い文字のどちらが読みやすいか確認できます。
HEX
ワンクリックで次の色に出会えます。
新しいランダムカラー
色は現在のブラウザタブで生成されます。
HEX
#7162E8RGB
rgb(113, 98, 232)HSL
hsl(247, 74%, 65%)最近の色
最近のパレットがここに表示されます。
色は現在のブラウザタブで生成されます。
ランダムカラーの使い方
クリックごとにRGBカラーを1つ作り、対応するHEXとHSLを計算します。
形式を確認
同じ色のHEX、RGB、HSL表現を確認します。
コピーして使う
デザインや開発ツールに必要な形式をコピーします。
ランダムカラーの使い方
デザインの発想
慣れたパレットを離れ、意外な色から始められます。
プロトタイプ
モックアップやコンポーネントテスト用の仮色を作れます。
色モデルの学習
同じ色のHEX、RGB、HSL表現を比較できます。
HEX、RGB、HSLとは？
RGBは赤、緑、青を0から255で表します。HEXは同じ値をCSSでよく使う6桁の16進数で表現します。
HSLは色相、彩度、明度を表し、鮮やかさや明るさを調整するときに直感的です。
よくある質問
カラーコードをコピーできますか？
はい。HEX、RGB、HSLをワンクリックでコピーできます。
すべてのRGB色が出ますか？
はい。各チャンネルは独立して0から255の整数になります。
文字色の提案はどう決めますか？
相対輝度を推定し、基本的なコントラストが強い白または暗い文字を提案します。
アクセシビリティ基準を保証しますか？
いいえ。実際の文字サイズ、太さ、UI状態を必要な基準でテストしてください。