Color Studio

インタラクティブなカラーホイールから調和のとれたカラーパレットを作成 — 類似色、補色、トライアドなどのハーモニールールを適用し、任意の値を即座にコピーできます。

開始色から終了色まで最大 10 ステップでブレンド — グラデーションをプレビューし、あらゆるシェードを取得して任意のフォーマットを即座にコピーできます。

単一の色から明るい色から暗い色まで全範囲を生成 — 明暗ステップとシェード数を選び、任意の値を即座にコピーできます。

任意の画像から洗練されたコピー可能なカラーパレットを抽出します。

HEX、RGB、RGBA、HSL、HSLA、HSV の間で色を変換 — 色を選び、アルファ値を調整し、任意のフォーマットを即座にコピーできます。

任意の色に最も近い CSS の名前付き色と最も近い Tailwind シェードを検索 — 知覚的にマッチしたコピー可能な値付き。

スポイトでスクリーンの任意のピクセルをサンプリング、またはドロップした画像から色を選び、コピー可能なパレットに収集します。

任意の写真から美しいグラデーションを抽出 — 画像をドロップしてムードを選ぶと、主要な色がドラッグ可能なグラデーションストップになります。すぐに使える CSS をコピーできます。

ドラッグ可能な多色ストップとキュレーション済みプリセットで、線形・放射状・円錐形の CSS グラデーションをゼロから作成。すぐに使える CSS をコピーできます。

色のセットを貼り付けるかインポートし、CSS 変数、SCSS、Tailwind config、JSON、SVG スウォッチに即座にエクスポート — あらゆるパレットの仕上げに。

テキスト色と背景色の WCAG コントラスト比をチェック — 通常テキスト、大きなテキスト、UI コンポーネントの AA/AAA 合否判定をライブプレビューとアクセシブルカラーの提案付きで確認できます。

第 1 色覚異常（赤盲）、第 2 色覚異常（緑盲）、第 3 色覚異常（青盲）、全色盲の方には画像やパレットがどのように見えるかを確認 — すべてブラウザで動作し、アップロードなし。