1つのツールキットで
あらゆるデザイン作業を
色彩理論からコントラストコンプライアンスまで — デザイナーと開発者向けに作成された 10 のツール
角丸生成
リアルタイム プレビューを備えた視覚的な境界線半径エディター。個別のコーナー コントロールを含む CSS コードをコピーします。
CSS・ビジュアルエディターシャドウ生成
マルチレイヤー化、リアルタイムの Canvas プレビュー、および CSS 出力を備えたインタラクティブなボックス シャドウ ビルダー。
CSS・階層化色覚シミュレーター
色覚異常のユーザーに色がどのように見えるかをシミュレートします。
アクセシビリティ·シミュレーションカラー変換
HEX、RGB、HSL、CMYK、OKLCH の間で瞬時の双方向変換を行います。
コンバーター · すべてのフォーマットカラーホイール
色相、彩度、色の関係を調べるためのインタラクティブなカラーホイール。クリックして色を選択し、ロックします。
インタラクティブ・ビジュアルコントラストチェッカー
テキストと背景の色が WCAG AA/AAA に準拠していることを確認します。アクセシビリティの評価をすぐに取得できます。
アクセシビリティ · AA/AAACSS Grid ジェネレーター
CSS Grid レイアウトをリアルタイムプレビューで視覚的に作成します。
CSS·ビジュアルエディターフォントペアリング
厳選されたコレクションから、見出しと本文の調和のとれたフォントの組み合わせを見つけてください。
タイポグラフィー · 300 以上のフォントグラデーション生成
リアルタイムのキャンバス プレビューを使用して、美しい線形および放射状のグラデーションをデザインします。 CSS コードを即座にコピーします。
グラデーション・CSSエクスポートグラデーションプリセット
15 の美しいグラデーション プリセットを参照してコピーします。
プリセット·ワンクリック画像から抽出
スマート カラー量子化を使用して、あらゆる画像から美しいカラー パレットを抽出します。
抽出・スマートパレット生成
単色、補色、類似、および 3 つのモードを使用して、調和のとれた配色を作成します。 CSS エクスポートによるリアルタイム プレビュー。
カラー・インタラクティブUIカラーシステム
単一のシード カラーから完全なデザイン トークン パレットを生成します。 Tailwind、CSS、または SCSS にエクスポートします。
デザイントークン・追い風14言語
すべてのツール、ラベル、ガイドを完全翻訳。
アクセシビリティ優先
すべてのパレットには WCAG コントラスト スコアが含まれています。最初から包括的に設計します。
開発者向けエクスポート
CSS、Tailwind、SCSS、JSON — プロジェクトに必要な形式をコピーします。