アクセシビリティ準拠のためのWCAGカラーコントラスト比を確認します。
HEX、RGB、HSL、CMYK、LABなどのフォーマット間で色を即座に変換します。
色彩調和のルールを使って美しいカラーパレットを生成します。
色覚異常を持つ人々にあなたの色がどのように見えるかを確認します。
任意の画像からカラーパレットを抽出します。画像をアップロードまたは貼り付けて開始してください。
任意の色に最も近いTailwind CSSカラークラスを見つけます。
CSSカラーフォーマット間で変換します。任意のCSSカラー値を貼り付けて変換してください。
任意の色を選択し、HEX、RGB、HSL、CMYKなど11種類以上のフォーマットで即座に値を取得できます。クリックでコピー。
インタラクティブなエディターで美しいCSSグラデーションを作成。カスタムカラーストップと角度で線形、放射状、円錐グラデーションを構築できます。
任意の色のシェードとティントを生成します。コピー可能なHEXコード付きで、より明るい・より暗いバリエーションを作成できます。
パステル、ビビッド、暖色、寒色などのオプション制約付きでランダムな色を生成します。HEXコード、RGB、HSL値を即座に取得できます。
調整可能な比率で2つ以上の色を混合します。HEX、RGB、HSLなどでブレンド結果を確認できます。
任意のhexまたはRGBカラーを入力して、最も近い名前付きカラーを見つけます。500以上の名前付きカラーのデータベースから、見ている色を特定します。
パレット内のすべての色の組み合わせのWCAGコントラスト比を確認します。AAおよびAAAアクセシビリティ基準に合格する組み合わせを見つけます。
背景色を入力して、WCAGアクセシビリティ基準を満たす最適なテキスト色を取得します。読みやすい前景色を即座に見つけます。
単一のブランドカラーから完全なTailwind CSSカラーパレット（50-950）を生成します。知覚的に均一なシェードを設定に貼り付ける準備ができます。
2つの色の間で均等に配置されたカラースケールを生成します。sRGB、HSL、LAB色空間での補間を比較できます。
カラーパレットをデザイントークンに変換します。CSSカスタムプロパティ、SCSS変数、Tailwind設定、またはJSONトークンとしてエクスポートできます。
画像からCSSグラデーションを抽出します。任意の画像をアップロードして、カラーストップ付きの最も近いCSS線形または放射状グラデーションを取得します。
インタラクティブなエディターでCSSボックスシャドウを作成・プレビューします。オフセット、ぼかし、拡散、色を調整。複数のシャドウを重ねられます。
CSSテキストシャドウを作成・プレビューします。オフセット、ぼかし、色を調整して、タイポグラフィに奥行きとスタイルを加えましょう。
個別のコーナーコントロールでCSS border-radiusの値を作成・プレビューします。楕円形の半径や複雑な形状をサポートしています。
見出しと本文のGoogle Fontsの組み合わせをプレビューします。カスタムカラーとサイズで最適なフォントペアリングを見つけましょう。