logo
GeekFormat

カラーコンバーター

最接近的 CSS 颜色名: mediumseagreen

RGB

R
G
B
A

HSL

H
S
L

HSV

H
S
V
HEX#22c55e
RGBrgb(34, 197, 94)
RGBArgba(34, 197, 94, 1)
HSLhsl(142, 71%, 45%)
HSLAhsla(142, 71%, 45%, 1)
HSVhsv(142, 83%, 77%)
HWBhwb(142, 13%, 23%)
CMYKcmyk(83%, 0%, 52%, 23%)
XYZxyz(22.64, 41.08, 17.32)
LABlab(70, -62, 40)
LCHlch(70, 74, 147)
OKLABoklab(1, 0, 0)
OKLCHoklch(1, 0, 180)

WCAG 对比度检查

白字
2.28:1
AA ✗AAA ✗
黑字
9.22:1
AA ✓AAA ✓

HEX、RGB、RGBA、HSL、HSLA、HSV、HWB、CMYK、XYZ、LAB、LCH、OKLAB、OKLCHを含む14種類のカラーフォーマット間のワンクリック変換に対応したオンラインカラーコンバーター。リアルタイム調整用のカラーピッカー、WCAGコントラストチェック、カラーハーモニー配色、シェード生成、一括変換、画像カラー抽出機能を内蔵。すべての計算はブラウザ内で完全にローカル実行—ファイルのアップロードは不要で、デザイナーとフロントエンド開発者に最適です。

関連おすすめ

色覚シミュレーター

画像フィルター

CSS Formatter

単位変換

通貨変換

画像形式変換

ユースケース

  • フロントエンド開発で、デザインモックアップのHEX値をCSSスタイル用のRGB/HSLに、透明度が必要な場合はRGBAに変換
  • UI/UXデザイナーがFigma、Sketch、Photoshopなどのデザインツール間を行き来する際にカラー値フォーマットを統一
  • 印刷制作の初期段階での打ち合わせ時に、スクリーンのRGB値を参考用にCMYKに変換
  • アクセシブルデザインでWCAG AA/AAA準拠のために文字色と背景色のコントラスト比をチェック
  • シェードジェネレーターを使用してデザインシステム構築用の完全な明暗ファミリーをすばやく生成
  • カラーハーモニーを使用してブランディングやポスターデザインのためのプロフェッショナルな配色（補色、類似色など）を生成
  • インスピレーションのためにリファレンス画像や写真から主要カラーを抽出（画像カラーピッカー）
  • デザインモックアップの複数のカラー値を一括処理し、必要なフォーマットに一度に変換
  • ホバーなどのCSSステートを記述する際にHSLまたはOKLCHで明るさと彩度を簡単に調整
  • モダンCSSのOKLCH色空間を使用して知覚的に均一なデザインシステムカラーを構築
  • 異なるフォーマットが同じ色をどのように表現するかをインタラクティブに視覚比較し、色空間の原理を学習
  • 任意のカラー値に対応する英語のCSSカラーネームをすばやく検索して参照とコミュニケーションを容易に

特徴

  • 14種類のカラーフォーマット変換：HEX、RGB、RGBA、HSL、HSLA、HSV、HWB、CMYK、XYZ、LAB、LCH、OKLAB、OKLCH、CSS規定のカラーネームに対応
  • スマート入力認識：任意のカラーフォーマットを貼り付けると自動検出。3桁短縮形#rgb、アルファ付き#rrggbbaa、rgb()、hsl()、CSSカラーネームに対応
  • リアルタイムスライダー調整：RGB赤/緑/青、HSL色相/彩度/明度、HSVスライダーで即座にWYSIWYGカラー調整
  • アルファ透明度対応：アルファチャンネル付きRGBA・HSLA変換、パーセンテージと小数の両方の不透明度フォーマットに対応
  • CSSカラーネームマッチング：最も近い標準CSSカラーネーム（140種類以上）を自動的に検索してクイックリファレンス
  • WCAGコントラストチェッカー：白文字・黒文字とのコントラスト比をリアルタイムで計算し、AA（≥4.5:1）とAAA（≥7:1）の合否判定を自動表示
  • カラーハーモニージェネレーター：補色、類似色、トライアド、スプリットコンプリメンタリー、テトラードの5種類の定番配色をワンクリック生成
  • シェード生成：従来のRGB混合シェードと知覚的に均一なOKLCHシェードの両方を利用可能、11段階の明度ステップを即座に生成
  • 一括変換：複数行入力で複数のカラー値を一括処理—デザインシステムのカラーパレット処理に最適
  • 画像カラーピッカー：画像をアップロードすると16色の主要カラーを自動サンプリングして抽出。リファレンスや写真からパレットを抽出するのに便利
  • ワンクリックコピー：各カラーフォーマットの横にコピーボタンを配置、標準表記で即座にコピー—CSSやデザインソフトにそのままペースト可能
  • ランダムカラージェネレーター：ワンクリックでランダムな色を生成、インスピレーションに
  • ピュアブラウザ処理：すべてのカラー計算はブラウザ内でローカル実行され、サーバーへのアップロードなし—登録不要で即座に利用可能
  • レスポンシブデザイン：デスクトップ、モバイル、タブレットでシームレスに動作—スマートフォンでも快適に色調整と値のコピーが可能

使い方

  1. 上部の入力ボックスに任意のカラーフォーマット値を入力するか、カラースウォッチをクリックしてピッカーを使用するか、RGB/HSL/HSVスライダーをドラッグして調整
  2. ツールがHEX、RGB、RGBA、HSL、HSV、CMYK、OKLCHを含む14種類のフォーマットすべてにリアルタイムで自動変換
  3. 配色には「カラーハーモニー」、明暗ランプには「シェード」、一括変換または画像カラー抽出には「一括/ピッカー」に切り替え
  4. 各カラーフォーマット横のコピーボタンをクリックすると標準表記を直接コピーして使用可能

よくある質問

カラーコンバーターはどのカラーフォーマットに対応していますか？

HEX（3桁短縮形とアルファ付き8桁）、RGB、RGBA、HSL、HSLA、HSV、HWB、CMYK、XYZ（D65光源によるCIE 1931）、CIE LAB、LCH、OKLAB、OKLCHに加え、140種類以上の標準CSSカラーネームの計14種類の一般的なカラーフォーマット間の変換に対応しています。任意のフォーマットを入力すると、他のすべてのフォーマットに自動変換されます。

このカラー変換ツールの使い方は？

とても簡単です：1）上部の入力ボックスに任意のカラー値を入力—例えば#22c55e、rgb(34,197,94)、hsl(142,71%,45%)、あるいはgreenのようなカラーネームでもOK；2）またはカラースウォッチをクリックしてピッカーを使うか、RGB/HSL/HSVスライダーをドラッグしてリアルタイム調整；3）下部に14種類すべてのフォーマット変換結果が即座に表示されます—各フォーマット横のコピーボタンをクリックするとクリップボードにコピーされます。

HEX、RGB、HSLの違いは？それぞれどこで使われますか？

HEXはウェブで最も一般的な16進数表記です—赤は#ff0000—CSSやデザインハンドオフファイルで広く使われています。RGBは赤、緑、青を0-255の値で表現し、スクリーンディスプレイの基礎となるカラーモデルです。HSLは色相（0-360°）、彩度、明度を使用し、人間の色知覚により適合しており、デザイナーが色を調整するのに直感的です。CMYKはシアン、マゼンタ、イエロー、ブラックのインクのパーセンテージで印刷に使用されます。OKLCHは現代の知覚的に均一な色空間で、視覚的に滑らかなグラデーションやシェードランプを生成します。

WCAGコントラスト比とは何ですか？どのくらいの比率がアクセシビリティ基準を満たしますか？

WCAGコントラスト比は文字色と背景色の輝度差を測定し、視覚障害のあるユーザーにとってコンテンツが読みやすいことを保証します。ウェブコンテンツアクセシビリティガイドラインによると：通常の本文テキストはレベルAA（合格）で≥4.5:1、レベルAAA（優秀）で≥7:1が必要；大きなテキスト（18pt以上の太字または24pt以上の通常）はAAで≥3:1が必要です。このツールは白文字と黒文字の両方に対するコントラスト比をリアルタイムで表示し、AAおよびAAA基準の合否判定を自動的に行います。

RGBAのAは何を意味しますか？透明度はどのように設定しますか？

RGBAのAはアルファチャンネルの略で、透明度を制御します—値は0（完全に透明）から1（完全に不透明）の範囲です。例えばrgba(34,197,94,0.5)は半透明の緑です。透明度はアルファスライダーで調整できます；変換結果にはアルファ付きのRGBA形式とHSLA形式の両方が表示されます。HEXでは6桁のカラーコードの後に16進数を2桁追加することで透明度に対応できます—例えば#22c55e80は50%の不透明度を表します。

OKLCHとLCHとは何ですか？HSLとどう違いますか？

LCHとOKLCHは知覚的に均一な色空間で、Lは明度、Cは彩度、Hは色相です。HSLに対する最大の利点は：同じL値の色が視覚的に実際に同じ明るさに見えることで、デザインシステムにとって重要です—HSLで色相は異なるが明度が同じパレットを生成すると、一部の色が他より暗く見えることがありますが、OKLCHは知覚的な明度の均一性を保証します。OKLCHはLAB/LCHより新しく、計算が単純で色の予測がより正確であり、モダンCSS（CSS Color Level 4）で推奨されています。

画像カラーピッカー機能の使い方は？

「一括/ピッカー」タブに切り替え、アップロードをクリックして画像を選択すると—ツールは自動的に画像を100×100グリッドにスケーリングし、均等に配置された位置から16色を抽出し、スウォッチとカラー値を表示します。任意のスウォッチをクリックすると、その色をメインカラーとして設定し、さらに調整・変換できます。リファレンス画像、デザインモックアップ、写真からすばやくパレットを抽出するのに最適です。

どのようなカラーハーモニー配色が利用でき、どのように使いますか？

ツールには5種類の定番ハーモニー配色が用意されています：1）補色：180°離れた色で高コントラスト；2）類似色：30°離れた色で自然な調和；3）トライアド：120°離れた色で鮮やかなバランス；4）スプリットコンプリメンタリー：ベースカラー＋補色の両側30°で柔らかさのあるコントラスト；5）テトラード（矩形）：90°間隔の4色で豊かな多様性。「カラーハーモニー」タブに切り替えると生成された配色が表示されます—任意のスウォッチをクリックするとメインカラーとして設定できます。

CMYK変換結果は印刷に直接使用できますか？

参考程度には適していますが、注意点があります：スクリーンは加法混色のRGB（発光）を使用し、印刷は減法混色のCMYK（インクの反射）を使用します。これらは色域が異なります—鮮やかな緑や青などの明るいRGB色の中にはCMYKインクで正確に再現できないものがあり、多少の色ずれが発生します。このツールは標準的なRGB-CMYK変換式を使用しており、初期段階の打ち合わせやクイックリファレンスに適しています。最終的な印刷出力には、適切なICCカラープロファイルを使用したプロフェッショナルデザインソフトでソフトプルーフを行うことを推奨します。

一括変換はどのように機能しますか？一度に何色変換できますか？

「一括/ピッカー」タブに切り替え、テキストボックスに1行に1色ずつ入力し（HEX/RGB/HSL/CSSカラーネームを自由に混在可能）、一括変換をクリックするとすべての色を一度に処理します。結果には各色のスウォッチとHEX値が表示されます。理論上の制限はありませんが、数百色ある場合はブラウザのラグを避けるために分割して処理することを推奨します。

モバイルでカラーコンバーターを使えますか？

はい。このツールはレスポンシブデザインを採用しており、モバイル、タブレット、あらゆるサイズのデスクトップ画面で問題なく動作します。モバイルでもカラー値の入力、スライダーによる色調整、変換結果の表示、値のコピーが可能で—すべての機能がデスクトップと同じように使えます。また、完全にローカルで計算されるため、モバイルデータ通信量を消費することもありません。

入力したら「認識できないカラーフォーマット」と表示されたら？

入力フォーマットを確認してください：1）HEXは#（省略可）で始まり、3、6、または8桁の16進文字（0-9/a-f）が必要—#f00、#ff0000、#ff0000ffはすべて有効；2）RGB形式はrgb(r,g,b)で、カンマで区切られた3つの0-255の値が必要；3）HSL形式はhsl(h,s%,l%)で、色相0-360°、彩度と明度0-100%が必要；4）CSSカラーネームはred/blue/greenなどの標準名である必要—日本語の色名には対応していません。

変換した色がソフトウェアによって違って見えるのはなぜですか？

これは正常なカラーマネジメントの動作です：ソフトウェア、モニター、OSが異なれば、使用するカラープロファイル（sRGB、Display P3、Adobe RGB）も異なる場合があり、同じカラー値でも視覚的にわずかな違いが生じることがあります。ウェブページはデフォルトでsRGB色空間を使用します—PhotoshopなどのソフトウェアでAdobe RGBやDisplay P3プロファイルを使用している場合は、ウェブで一貫して表示するためにエクスポート時にsRGBに変換する必要があります。

フロントエンド開発ではどのカラーフォーマットを使うべきですか？

モダンCSSはすべてのカラーフォーマットに対応しています：HEXは最も一般的で互換性が最も高く、デザインハンドオフの標準；RGB/RGBAは動的な不透明度調整やチャンネルレベルの操作が必要な場合に適しています；HSLはコード内で直接色のバリエーションを記述するのに最も直感的です（ホバー時にLを上げるだけで明るくするなど）；OKLCHは将来の標準で、CSS Color Level 4でネイティブ対応されており、知覚的均一性によりシェードやグラデーションの生成に最適です—プロジェクトの互換性ニーズに基づいて選択してください。

シェード生成機能は何のためにありますか？従来のシェードとOKLCHシェードの違いは？

シェード生成は、あるカラーファミリーの11段階（50-900）の明暗バリエーションを即座に作成し、デザインシステムのパレット（Tailwindのカラーシステムなど）を構築するのに最適です。従来のシェードはRGB空間で単純に白に向かって混合します—数値的には均一ですが、中間トーンが不均一に見えることがあります。OKLCHシェードは色相と彩度を維持したまま明度Lのみを調整し、明暗間の視覚的に滑らかな移行を生成します—よりプロフェッショナルで洗練された仕上がりになります。

色空間とカラーフォーマット変換について

カラーコンバーターはデザイナーとフロントエンド開発者にとって最も頻繁に使用されるツールの1つであり、異なる色表現間の正確な変換を提供します。色そのものは視覚的な知覚です；コンピューターや印刷で色を表現するために、人々は同じ色を異なる数値システムで記述する複数のカラーモデル（色空間）を開発してきました。それぞれが異なるシナリオやデバイスに適しています。

一般的なカラーフォーマットには以下が含まれます：HEX（16進数RGB、ウェブの標準表記）、RGB（赤/緑/青を0-255で表現、スクリーンディスプレイの基礎）、HSL（色相/彩度/明度、人間の色調整に最も直感的）、CMYK（シアン/マゼンタ/イエロー/キーブラックのパーセンテージで印刷用）。近年、OKLCHのような知覚的に均一な色空間が人気を集めています。なぜなら、同じ明度値の色が視覚的に実際に同じ明るさに見えることを数学的に保証し、デザインシステムの構築やグラデーション生成に重要だからです。

なぜカラーフォーマット間で変換するのでしょうか？ツール、プラットフォーム、出力メディアが異なれば使用するカラーフォーマットも異なります：ウェブCSSはHEX/RGB/HSL/OKLCHなどに対応；Figma/SketchのようなデザインソフトはデフォルトでHEXを使用；印刷はCMYKが必要；そしてホバーステートや不透明度変更のようにコード内で色を動的に調整する場合、HSLとOKLCHはHEXよりはるかに便利です。正確なカラー変換により、デザインモックアップと最終実装の間で色の一貫性が保証されます。

WCAGコントラストはウェブアクセシビリティの重要な基準であり、前景テキストと背景色の輝度差を測定して視覚障害のあるユーザーにとっての可読性を保証します。通常の本文テキストは4.5:1のコントラスト比（AAレベル）が必要で、重要なコンテンツは7:1（AAAレベル）が推奨されます。当ツールはこれをリアルタイムで計算し、デザイナーが後で修正するのではなく、色選択時にアクセシビリティを考慮できるよう支援します。

カラーハーモニーはカラーホイールに基づく古典的な色彩理論で、ホイール周りの色相の幾何学的位置を使用して視覚的にまとまりのある組み合わせを生成します。補色はボタンやアクセントに最適な強いコントラストを作成；類似色は大きな背景エリアに調和的で自然；トライアドとテトラード配色はブランドアイデンティティにバランスと豊かさを提供します。このツールには最も一般的に使用される5種類のハーモニー配色が含まれており、ワンクリックでパレットを生成します。

カラーシェード/ティントは同じ色相の明暗バリエーションであり、デザインシステムを構築するための基礎です（Tailwind CSSの50-900パレットのように）。従来のRGBシェードは単純に白に向かって混合しますが、視覚的に不均一に見えます；OKLCHベースのシェードは色相と彩度を維持したまま明度のみを調整し、視覚的に滑らかな明暗移行を生成します—現代のデザインシステムに推奨されるアプローチです。当ツールは比較用に両方のシェードスタイルを提供しています。

なぜローカル処理が重要なのでしょうか？カラー変換は純粋に数学的なものであり、サーバーへのデータアップロードは一切必要ありません。当ツールのすべての計算はブラウザ内で完全にローカル実行されます—ページを開くと即座に使用でき、登録やログインは不要、画像やカラーデータがアップロードされることもありません。高速でプライバシーが保護されており—未発表の機密デザインモックアップのカラーでも安心して使用できます。

重要な注意点：カラーフォーマット変換は数学的には正確ですが、スクリーンの色域、モニターキャリブレーション、印刷プロセスにより、同じカラー値でもデバイスやメディア間でわずかに異なって見える場合があります。スクリーンは加法混色のRGB（光を加えるほど明るくなる）を使用し、印刷は減法混色のCMYK（インクを重ねるほど暗くなる）を使用します。両者は色域が異なり、彩度の高いRGB色の中にはCMYKインクで正確に再現できないものがあります。変換結果はデジタルデザインとウェブ開発に最適です；最終的な印刷出力には、プロフェッショナルなカラーマネジメントソフトウェアでプルーフを行うことを推奨します。

术语表

HEX
#に続く6桁の16進数でRGBを表す16進数カラー表記（各チャンネル2桁、00-FF）—赤は#FF0000で、ウェブとデザインソフトで最も一般的なフォーマット。3桁短縮形（#f00など）とアルファ付き8桁表記に対応。
RGB/RGBA
赤、緑、青の0-255の3つの値で色を表現；rgba()は透明度用のアルファチャンネル（0-1）を追加。スクリーンディスプレイの基礎となるカラーモデル。
HSL/HSLA
色相（0-360°）、彩度（0-100%）、明度（0-100%）で色を表現し、人間の色知覚により適合—デザイナーが色を調整するのに直感的。
HSV/HSB
色相、彩度、値/明度—HSLに似ているが明度の計算が異なり、Photoshopなどのデザインソフトのカラーピッカーで一般的。
HWB
色相、白み、黒み—CSS Color Level 4で追加され、HSLより直感的：白または黒を加えるだけで色調を調整可能。
CMYK
シアン、マゼンタ、イエロー、キー（ブラック）のインクのパーセンテージで、印刷業界でインク混合比を表すために使用。
CIE LAB/LAB
国際照明委員会（CIE）によって定義された知覚的に均一な色空間：Lは明度（0-100）、aは緑-赤軸、bは青-黄軸—数値的な距離が知覚される色の差に対応するよう設計。
LCH
LABから変換された極座標表現：L明度、C彩度、H色相—HSLより知覚的に均一で、正確な知覚制御を必要とするプロフェッショナルデザインに適しています。
OKLAB/OKLCH
2020年に導入された新世代の知覚的に均一な色空間—LAB/LCHより計算が単純で色相の予測がより正確。OKLCHはその極座標形式で、モダンCSSでネイティブ対応されており、デザインシステムの構築に推奨。
WCAGコントラスト
ウェブコンテンツアクセシビリティガイドラインで規定された前景テキストと背景の輝度比：本文テキストの場合AAは≥4.5:1、AAAは≥7:1が必要—視覚障害のあるユーザーの可読性を保証。
カラーハーモニー
カラーホイール周りの位置に基づく色彩理論で、幾何学的関係（補色180°、類似色30°間隔、トライアド120°間隔など）を使用して視覚的にまとまりがあり美的に心地よい組み合わせを生成。
シェード/ティント
同じ色相の明暗バリエーションの範囲で、通常50から900までの11段階で生成され、単一の色の異なる用途（背景、ボーダー、テキスト、アクセント）のためにデザインシステムで使用。

14種類のカラーフォーマット比較クイックリファレンス

各カラーフォーマットの値の範囲、純粋な赤の例、主な使用例は以下の通りです：

フォーマット値の範囲純粋な赤の例主な使用例
HEX#RRGGBB 00-FF#ff0000ウェブCSS、デザインハンドオフ—最も汎用的なフォーマット
RGBR/G/B: 0-255rgb(255,0,0)スクリーンディスプレイの基礎、Canvas/WebGLプログラミング
RGBAA追加: 0-1rgba(255,0,0,1)透明度が必要なCSS、オーバーレイ効果
HSLH:0-360°, S/L:0-100%hsl(0,100%,50%)デザイナーの色調整、コード内での動的カラー操作
HSVH:0-360°, S/V:0-100%hsv(0,100%,100%)Photoshopなどのデザインソフトのカラーピッカー
HWBH:0-360°, W/B:0-100%hwb(0,0%,0%)CSS Color 4—白/黒を追加して直感的に調整
CMYKC/M/Y/K: 0-100%cmyk(0%,100%,100%,0%)印刷・出版業界
OKLCHL:0-1, C:0-0.4, H:0-360°oklch(0.63,0.24,29)モダンCSS、デザインシステムパレット、知覚的に均一なグラデーション

WCAGアクセシビリティコントラスト基準リファレンス

ウェブコンテンツアクセシビリティガイドライン（WCAG 2.1）の最小コントラスト要件：

レベルコントラスト比要件対象テキストタイプ備考
AA≥ 4.5:1通常本文テキスト（18pt未満の通常または14pt未満の太字）最小合格基準、法令遵守要件
AA≥ 3:1大きなテキスト（18pt以上の通常または14pt以上の太字）大きな見出しは要件が緩和される場合がある
AAA≥ 7:1通常本文テキスト（強化）重要なコンテンツ、長文読み物に推奨
AAA≥ 4.5:1大きなテキスト（強化）優れたアクセシブルデザイン

5種類のカラーハーモニー配色クイックリファレンス

色相ホイールの角度に基づく定番のカラー組み合わせ—クリックで即座に生成：

配色タイプ色相間隔色数視覚効果と使用例
補色180°離れる2色強いコントラスト—ボタン、アクセント、CTAに最適
類似色±30°隣接3色調和的で自然—大きな背景、プライマリパレットに最適
トライアド120°間隔3色鮮やかでバランスが良い—ブランディング、イラストに最適
スプリットコンプリメンタリーベース＋補色の±30°3色柔らかさのあるコントラスト—補色より洗練された印象
テトラード90°間隔4色豊かで多様性がある—複雑なデザイン、子供向け製品に最適

Privacy & Security

このカラーコンバーターは、すべてのカラー計算、画像カラーピッキング、一括処理をブラウザ内で純粋なJavaScriptを使用してブラウザメモリ上で完全にローカル実行します。入力したカラー値やアップロードした画像がネットワークを介してサーバーに送信されることはなく、ログ、キャッシュ、保存されることもありません。処理後、ページを閉じるかリフレッシュすると、ブラウザメモリから一時データが自動的にクリアされます。未発表のデザインモックアップのカラーやブランドカラーなどの機密コンテンツも、漏洩リスクなしで安心して使用できます。

Authoritative References

Troubleshooting

入力したら「認識できないカラーフォーマット」と表示されたら？

確認してください：1）HEX形式は有効な16進文字（0-9、a-f、A-F）を3、6、または8桁で使用；#は省略可；2）RGB/RGBA形式は括弧内に3つまたは4つの値が必要—R/G/Bは0-255、アルファは0-1で、カンマで区切る；3）HSL/HSLA形式はHが0-360、SとLが0-100のパーセンテージ値である必要；4）CSSカラーネームは標準的な英語名である必要—日本語の色名には対応していません。

CMYK変換が実際の印刷と違って見えるのはなぜですか？

これは予期されることです：RGBとCMYKは色域が異なり、多くの明るいRGB色はCMYKインクで再現できません。このツールは初期リファレンスに適した標準変換式を使用しています。プロフェッショナル印刷には：1）デザインソフトでCMYKモードに変換；2）正しいICCカラープロファイルを使用；3）デジタルプルーフを実施してください。

同じ色が携帯とコンピューターで違って見えるのはなぜですか？

画面によって色域カバレッジ、色温度、輝度、キャリブレーションが異なります：MacはデフォルトでDisplay P3広色域、ほとんどのWindows PCはsRGBを使用しており、モバイル画面も様々です。ウェブデザインはほとんどのデバイスで一貫した表示をするために、ベースラインとしてsRGBに標準化することが推奨されます。

カラーピッカー用の画像アップロードが反応しない？

ご確認ください：1）標準的な画像形式（JPG/PNG/GIF/WebP）をアップロードしている；2）画像ファイルが破損していない；3）ファイルサイズが大きすぎない（5MB以下を推奨）。画像のカラーピッキングはキャンバス内でローカル処理され、サーバーにアップロードされることはありません—リフレッシュして再アップロードすると通常は問題が解決します。