ランダム数生成器
全24ビットRGB空間からランダムな色を選択し、その色が大きなサンプルとして表示される様子を確認します。左右にはすべての一般的な表現形式が示されています：ヘキサデシカル（#a3e1b4）、RGB（rgb(163, 225, 180)）、HSL、および一致した場合に適用されるCSS名による色のバックボーンも含まれます。サンプルをクリックすると再度選択できます。
ランダムな色を生成する方法
-
1
生成をクリック
3つのランダムなバイト（0～255）がR、G、Bチャンネルとなる。
-
2
すべての形式を読み込む
Hex、RGB、HSL、HSVがすべて表示されています。スタイルシートで使用している値をコピーしてください。
-
3
お好みに合わせてロックします
結果が望む値に近い場合は、「色調を固定」をオンにして色調を維持し、明るさと彩度のみを再調整してください。
色空間
このジェネレータは24ビットのRGBからデータを取得しており、可能な色数は16,777,216色に達します。これはモニターが表示できる色域と同一ですが、そのうち一部の色値は濃い色域や色飽和度の低い領域に位置しており、区別が困難な場合があります。
各フォーマットが同じ色をどのように表現しているか
| フォーマット | 文法 | 1チャンネルあたりのバイト数 |
|---|---|---|
| ハッシュ | #RRGGBB |
8ビット |
| RGB | rgb(R, G, B) |
8ビット |
| HSL | hsl(H, S%, L%) |
推導型 |
| HSV | hsv(H, S%, V%) |
推導型 |
| OKLCH | oklch(L C h) |
感覚的に均一 |
なぜ純粋なランダム性が曖昧に見えるのか
均一なランダムRGBは、明るく鮮やかな色よりも、知覚的に暗く、色飽和度の低い色に多く現れます。より鮮やかな結果を求める場合は、HSLを用いて再生成し、色飽和度を60％以上、明度を45％から65％の間で固定してください。そうすれば、泥のように暗い色ではなく、雑誌表紙のような鮮やかな色が得られます。
アクセシビリティ
生成された色を白色または黒色のテキストと組み合わせ、ボタンの背景として使用する前にWCAGのコントラスト比を確認してください。本文のテキストでは最低値は4.5:1、大きなテキストでは3:1です。
よくある質問
RGB空間の大部分は暗い、色飽和度の低い中間領域に位置しているため、鮮やかな色が現れるのは縁付近の薄い領域のみです。生き生きとした結果を得るには、HSLまたはOKLCHで制限された色飽和度条件下で生成してください。
露出している場合、色相固定モードを使用します：度数で色相を選択し、ツールは飽和度と明度のみを調整します。ブランドカラーのトーンを探索するのに役立ちます。
現在はシードを使用しないモードです——各クリックは暗号RNGから独立して生成されます。色を保持するにはヘックスコードをコピーしてください。
大まかに。ヘックスコードはデバイス依存性があります。校正済みのsRGBディスプレイでは正確に表示されますが、安価なノートパソコンでは青色方向にずれます。印刷用の場合は、外観を信頼する前にCMYKに変換してください。
関連ツール
ランダムカラーパレットジェネレータ
ランダムなベース色を基に、補色、類似色および三色組み合わせのバリエーションからなる5色パレットを生成します。
カラーパレットジェネレーター
補色、類似、三項、分割補色スキームを使用して、ベース カラーから調和のとれた 4 ～ 8 色のカラー パレットを生成します。
ランダム文字生成器
英語アルファベットからランダムな文字を生成します。大文字・小文字の有無、重複の有無、および生成数を設定できます。
HEX色選択ツール
任意の色を視覚的に選択し、そのHEX、RGB、HSL、HSVおよびCMYK値に加え、白および黒に対するアクセシビリティコントラストも取得します。
JSONフォーマット
調整可能なインデント、並べ替えられたキー、およびエラーを正確な位置で強調するインライン検証機能を備えた、フォーマットされ、美しく印刷可能なJSONデータ。
ランダムな文字列生成器
人気のある名前および姓のリストから妥当な英語名を生成します。性別、数、書式を選択してください。