ブラウザー内で完結するツール
画像カラーパレットジェネレーター
画像から主要な色の実用的なパレットを抽出し、HEX、RGB、CSS、JSON の値をコピーできます。
画像ごとに最大 20 MiB・40 メガピクセル。コンタクトシートは 2–50 枚、合計 100 MiB まで。アイコンは画像全体を透明な余白付きで正方形に収めます。
ブラウザー内でローカル処理アカウント不要無料で利用可能 元画像はそのまま
このツールがある理由
五～八色程度のスウォッチがあれば、実用的なパレットになります。
- ✓ 3–10 色
- ✓ HEX/RGB
- ✓ CSS 変数
- ✓ JSON
こんな用途に
- • ブランドのインスピレーション
- • UI デザイン
- • プレゼンのテーマ
写真を使えるカラーパレットに変える
パレットは、インターフェースの色、プレゼンのアクセント、ブランドに着想を得た少数のスウォッチなど、実際のデザイン判断に役立つときに最も便利です。
主要な色を出発点にする
写真から作るパレットは、多くのピクセルを占める色に重みが置かれます。インスピレーションには便利ですが、そのままアクセシブルな UI パレットになるわけではありません。
HEX や RGB の値をデザインツールにコピーし、文字や操作部品に使う前にコントラストを別途確認してください。
パレットは少なめに保つ
ほとんど同じスウォッチが並ぶより、少数の色のほうが扱いやすくなります。コンパクトなセットから始め、必要なときだけ特別なアクセントを加えましょう。
よくあるご質問
写真のパレットは何色にすべきですか？
少ないパレットのほうが使いやすいのが普通です。六色は実用的な出発点で、画像に異なる領域が複数ある場合は色を増やすと役立ちます。
抽出した色はアクセシブルな UI カラーですか？
自動的にそうなるわけではありません。インターフェースに使う前に、文字と操作部品のコントラストを別途確認してください。
HEX 値を取得できますか？
はい。CSS やデザイン作業に使える色の値を表示します。
パレットの色が少し違って見えるのはなぜですか？
ノイズを減らすために近い色をまとめて抽出するため、表示されるスウォッチは代表色であり、元のピクセルをすべて記録したものではありません。
作業を続ける
Base64 から画像への変換
Base64 文字列や data URI をデコードして画像をプレビューし、ブラウザー上で実際のファイルとしてダウンロードできます。
画像をオンラインでぼかす
共有や公開の前に、画像に調整可能なぼかしをかけます。スクリーンショット、背景、配慮が必要な内容をやわらげるのに便利です。
画像をオンラインでトリミング
JPG、PNG、WebP 画像を、元画像を引き伸ばさずに任意の範囲でトリミングします。フォーム、ウェブサイト、SNS 向けに写真をすばやく整えられます。
ファビコンジェネレーター
1 枚の画像から、ブラウザー、Apple touch、PWA 向けのサイズとコピーして使える HTML を含む実用的なファビコンセットを作成します。
画像をオンラインで反転
寸法を保ったまま画像を左右または上下に反転し、ダウンロード用の新しいコピーを作成します。
画像の縦横比計算ツール
画像の縦横比を読み取り、16:9、4:3、1:1、4:5 や任意の比率に合う寸法を計算します。