美しいパレット。検証済みのコントラスト。一つのワークフローで。
ブランドカラーを入力するだけで、調和のとれたパレット、すべてのWCAG判定結果、そしてCSS・Tailwind・Figma用のエクスポートがそのページ内で完結します。
月額 $5〜 — いつでも解約可能
パレットを生成
ブランドカラーを選択。ColorWell が残りを構築します。
類似色
シェード(明→暗)
エクスポート
デザイントークンをダウンロード
Proフルパレットとシェードランプをすぐに使えるファイル形式で保存します。
ファイルをダウンロードするにはProにアップグレードしてください
コントラストチェック
パレットから任意の2色を選択すると、ColorWellがWCAG判定を表示します。
判定結果: WCAG基準を満たしていません
ブランドパレットに必要なすべて
毎日インターフェースを開発するデザイナーとフロントエンドチームのために構築されました。
調和のとれたパレット
任意のHEXカラーを選択すると、ColorWellが類似色、補色、トライアド、モノクロームのスキームをワンクリックで生成します。
WCAGコントラストを瞬時にチェック
パレット内のすべてのカラーペアに対し、テキスト、大サイズテキスト、UIコンポーネントに対するAA/AAA判定を行います。
CSS、Tailwind、Figmaへのエクスポート
ワンクリックでCSS変数、Tailwind設定、JSONトークン、またはそのまま貼り付け可能なFigmaスタイルへエクスポートできます。
ブランドを維持したままのバリエーション
色相をずらさずに明るさや彩度を調整。ColorWellは知覚色空間(Oklch)内で動作します。
名前付きトークン
"indigo-500"や"slate-700"のような自動命名により、HEXコードではなく人間にとって読みやすいスタイルシートを実現します。
パレットの保存と同期
作成したすべてのパレットは保存可能です。名前やタグを付けて後から呼び出せます。Proプランではクラウド同期に対応。
3 ステップ
単一のブランドカラーから始まり、実用的なスタイルシートで終わる。
選択
HEX値を入力するか、カラーピッカーを使用します。
生成
ColorWellが調和のとれたパレットを構築し、すべてのコントラストチェックを実行します。
エクスポート
CSS、Tailwind、またはFigmaトークンをコピーして、そのままコードベースへ貼り付けます。
シンプルな料金体系
プランを選択し、HEXコードとの格闘を終わらせましょう。
フリーランスデザイナー向け
- 月100件のパレット保存
- 無制限のコントラストチェック
- CSS / Tailwind / JSON エクスポート
- ブランドガイドラインに沿ったバリエーション
ブランドチーム向け
- 月2000件のパレット保存
- Figma トークンエクスポート
- ブランドキット(複数パレットプロジェクト)
- クラウド同期ライブラリ
- 優先サポート
よくある質問
インストールは必要ですか?
いいえ。ColorWell はブラウザ上で完全に動作します。同期を選択するまで、カラーデータはデバイスから離れません。
どのカラースペースを使用していますか?
ColorWell は内部的に Oklch を使用しています。視覚的に均等なカラースペース内でバリエーションを生成するため、ブランドカラーを明るくしても色相がずれません。
エクスポートはどのように機能しますか?
CSS 変数、Tailwind 設定ブロック、生 JSON、または Figma 対応スタイルをワンクリックでクリップボードにコピー。コードやデザインツールにそのまま貼り付けられます。
無料トライアルはありますか?
いいえ、これは有料ツールで、月額$5からのプランを提供しています。Starterは月額$5、Proは月額$15で、いつでも解約可能です。
解約方法は?
アカウントページから、またはメールにてご連絡ください。解約すると次回の更新は停止されますが、残りの期間は引き続きご利用いただけます。