メインコンテンツへスキップ
広告スペース (728x90)

ColorCraft

プロ級の配色を、ワンクリックで。

本日の残り: 10

☆ 保存済みパレット

まだパレットが保存されていません。「保存」ボタンでお気に入りを保存しましょう!

⚪ コントラストチェッカー

パレット内の色同士のコントラスト比をWCAG基準でチェック

ColorCraft について

🎨 カラーハーモニーとは

カラーハーモニー(色彩調和)は、色相環上の関係に基づいて美しい配色を生成する理論です。補色、類似色、トライアドなどの手法で、プロのデザイナーが使う配色パターンを誰でも簡単に作成できます。

♿ アクセシビリティ対応

WCAGガイドラインに準拠したコントラスト比チェック機能を搭載。テキストと背景の組み合わせが読みやすいかどうかを自動判定します。

💻 開発者向けエクスポート

生成したカラーパレットをCSS変数、SCSS変数、Tailwind設定、JSON形式で即座にエクスポート。コピー&ペーストですぐにプロジェクトに組み込めます。

なぜColorCraftを選ぶべきか

7種類のカラーハーモニーアルゴリズム

補色・類似色・トライアド・スプリット補色・テトラド・モノクロマティック・ランダム。色彩理論に基づいた配色を瞬時に生成します。

画像からカラー抽出(k-means法)

写真やイラストをアップロードするだけで、k-meansクラスタリングによる正確な色抽出。デザインの参考配色を自動で取得できます。

CSS/SCSS/Tailwind/JSONエクスポート

生成したパレットをCSS変数・SCSS変数・Tailwind設定・JSON形式で即座にエクスポート。コピー&ペーストですぐにプロジェクトに組み込めます。

WCAGコントラストチェッカー内蔵

パレット内の全色ペアでWCAG基準のコントラスト比を自動計算。AAA/AA判定でアクセシブルな配色設計をサポートします。

ご意見・ご要望

このツールの改善にご協力ください。機能リクエストやバグ報告を歓迎します。

フィードバックを送る

デザイナー向けツール情報

CSSテクニックやカラー理論など、デザインに役立つ情報を配信。

広告 (160x600)