ランダムカラー生成ツール
ランダムな色をHEX・RGB・HSL形式で生成します。鍵アイコンでお気に入りの色をロックできます。
#B0D6F9
rgb(176, 214, 249)
hsl(209, 86%, 83%)
#4AFFB3
rgb(74, 255, 179)
hsl(155, 100%, 65%)
#3D9787
rgb(61, 151, 135)
hsl(169, 42%, 42%)
#D8AFC4
rgb(216, 175, 196)
hsl(329, 34%, 77%)
#6F2F2E
rgb(111, 47, 46)
hsl(1, 41%, 31%)
#262B24
rgb(38, 43, 36)
hsl(103, 9%, 15%)
ランダムカラー生成ツールの使い方
「新しい色を生成」ボタンをクリックすると、6色のランダムカラーが表示されます。
鍵アイコン（🔓）をクリックするとその色をロックでき、次回生成時もその色が保持されます。
各色のHEX・RGB・HSL値をコピーボタンでクリップボードにコピーできます。
すべての処理はブラウザ内で完結するため、データが外部に送信されることはありません。
おすすめサービス
Canva Pro - デザインツール
デザインプロ品質のデザインを簡単作成。テンプレート豊富で初心者にもおすすめ。
Adobe Creative Cloud
デザインPhotoshop・Illustrator等のプロ向けデザインツール。学割あり。
※ PR・広告を含みます
関連ツール
🎨🖥️🌈🌈🖼️🖌️🔤📱🔖👁️📐🎬
カラーコード変換
HEX・RGB・HSLのカラーコードを相互変換。プレビュー付きで色を確認。
アスペクト比計算
画面の幅と高さからアスペクト比を計算。動画・画像サイズに。
HTMLカラー名一覧
CSS/HTMLカラー名とコードを検索。127色対応。
CSSグラデーション生成
グラデーションCSSコードを視覚的に生成。
CSSボックスシャドウ生成
box-shadowをスライダーで視覚的に生成。
カラーパレット生成
ベースカラーから配色パレットを自動生成。
フォントプレビュー
テキストを様々なフォントで比較プレビュー。
OGP画像サイズ一覧
SNS別のOGP推奨画像サイズを一覧表示。
ファビコンプレビュー
テキストや絵文字からファビコンをプレビュー。
コントラスト比チェック
WCAG基準で色のアクセシビリティを確認。
ピクセル⇔cm変換
DPI指定でpx/cm/mm/inchを相互変換。
CSSアニメーション生成
CSSアニメーションを視覚的に生成。