カラー

2 つの色を選んで、どれくらい知覚的に異なるかを表示 — CIE76 ΔE、CIEDE2000 ΔE、プレーンな RGB 距離と並列スウォッチ。

ケルビン値をスライドして、温かい琥珀色からニュートラルホワイト、クールブルーへと変化する黒体色を見る — 一般的な光源プリセットも。

Tailwind CSS のデフォルトパレット全体 — 22 色相 × 11 シェード（50〜950）— クリックで Tailwind クラス、HEX、rgb() としてコピー。

色相・彩度・明度・アルファのスライダーで色を調整 — HEX・RGB・HSL・Tailwind 任意値をコピー。

147 個の CSS / X11 named color — HEX・RGB・ライブスウォッチ、検索・色相系列別グループ化。

基本色からティント（明るく）·シェード（暗く）·トーン（グレー混合）を生成。2〜20 ステップ、HEX·RGB·HSL 出力。

2 色を RGB・HSL・CIELAB 空間で補間。11 段階の中間グラデーション ストリップ表示。

コントロールポイントをドラッグして CSS イージング曲線を設計 — 動きをライブプレビュー、cubic-bezier() 値をコピー。

純 CSS で 8 方向の三角形を生成 — border トリックまたは clip-path、ルールをコピーして貼付。

コーナーを個別ドラッグ、楕円半径、CSS コピー — チャットバブル・ピル・ブロブ・タブのプリセット付き。

2 つのビューポート幅間でなめらかにスケールする `font-size: clamp(...)` を生成 — 1 行コピー。

blur・brightness・contrast・hue・sepia・invert など 9 種を視覚的に組み合わせ — CSS や Tailwind 任意値でコピー。

画像をドロップすると Canvas で主要色を分析しパレット抽出 — HEX をコピーまたは一括取得。

8 種類の色覚異常（CVD）で画像がどう見えるかを再現。

複数レイヤーで CSS box-shadow を視覚的にデザイン — リアルタイムプレビュー + CSS / Tailwind 出力。

任意の色を HEX・RGB・HSL・HSV・OKLCH・CSS 変数で一括変換。

線形・放射状 CSS グラデーションを多段カラーストップでデザインし、コードをコピー。

基準色から 6 種類のスキームで調和の取れたパレットを作成。

文字／背景のコントラストを WCAG AA・AAA 基準でチェック。

16 進カラーのリストを貼り付けて色相、彩度、明度、または知覚的明るさでソート — デザイントークンパレットを整えるのに便利。