カラー名前付きカラーを検索

パレット厳選カラーパレットを閲覧。

パレット作成カスタムパレットを作成 — 色を選び、タグ付けして共有。

色からパレットベースカラーから即座にパレット提案を取得。

カラーハーモニー補色、三色配色などのカラーハーモニーを探索します。

画像から抽出写真から色を抽出

ビジュアライザー実際のデザインモックアップでパレットをプレビュー。

コンポーネントボタン、入力フィールド、バッジなどの基本UI要素をパレットでプレビューできます。

チャート棒グラフ、折れ線グラフ、ドーナツチャートにパレットを適用して確認できます。

見出しタイポグラフィのためのあらゆる背景色とテキスト色の組み合わせを探索できます。

ロゴロゴやワードマークのブランドカラーの組み合わせをテストできます。

アイコンLucideやHeroiconsのマルチカラーアイコンにパレットを適用してプレビューできます。

DaisyUIテーマ任意のベースカラーから完全なDaisyUIテーマを生成します。

Tailwind CSSTailwind CSSカラースケールを作成・プレビューします。

Shadcn UIshadcn/uiデザイントークンにマッピングしたパレットをプレビューできます。

Material 3Material Design 3のダイナミックカラートークンとしてパレットを確認できます。

BootstrapBootstrap 5コンポーネントスタイリングでパレットをプレビューできます。

アプリモックアップリアルなモバイルアプリモックアップで色をプレビューできます。

パターン幾何学的・抽象的なパターンデザインでパレットをプレビューできます。

テンプレートSVGテンプレートレイアウトにパレットを適用してプレビューできます。

カラーピッカー色を選択・変換

コントラストチェッカーWCAGアクセシビリティテスト

色覚シミュレーション色覚異常をテスト

コンバーターHEX、RGB、HSL、CMYK などの色形式を変換。

グラデーション生成CSSグラデーションを作成

ロゴジェネレーターロゴとアイコンで色をテスト

マイパレットカラーパレットを保存、整理し、フレームワークトークンを割り当てます。

言語を選択

ツール

カラー名前付きカラーを検索

パレット厳選カラーパレットを閲覧。

パレット作成カスタムパレットを作成 — 色を選び、タグ付けして共有。

色からパレットベースカラーから即座にパレット提案を取得。

カラーハーモニー補色、三色配色などのカラーハーモニーを探索します。

画像から抽出写真から色を抽出

ビジュアライザー実際のデザインモックアップでパレットをプレビュー。

コンポーネントボタン、入力フィールド、バッジなどの基本UI要素をパレットでプレビューできます。

チャート棒グラフ、折れ線グラフ、ドーナツチャートにパレットを適用して確認できます。

見出しタイポグラフィのためのあらゆる背景色とテキスト色の組み合わせを探索できます。

ロゴロゴやワードマークのブランドカラーの組み合わせをテストできます。

アイコンLucideやHeroiconsのマルチカラーアイコンにパレットを適用してプレビューできます。

DaisyUIテーマ任意のベースカラーから完全なDaisyUIテーマを生成します。

Tailwind CSSTailwind CSSカラースケールを作成・プレビューします。

Shadcn UIshadcn/uiデザイントークンにマッピングしたパレットをプレビューできます。

Material 3Material Design 3のダイナミックカラートークンとしてパレットを確認できます。

BootstrapBootstrap 5コンポーネントスタイリングでパレットをプレビューできます。

アプリモックアップリアルなモバイルアプリモックアップで色をプレビューできます。

パターン幾何学的・抽象的なパターンデザインでパレットをプレビューできます。

テンプレートSVGテンプレートレイアウトにパレットを適用してプレビューできます。

カラーピッカー色を選択・変換

コントラストチェッカーWCAGアクセシビリティテスト

色覚シミュレーション色覚異常をテスト

コンバーターHEX、RGB、HSL、CMYK などの色形式を変換。

グラデーション生成CSSグラデーションを作成

ロゴジェネレーターロゴとアイコンで色をテスト

マイパレットカラーパレットを保存、整理し、フレームワークトークンを割り当てます。

デザイナーと開発者のための高度なカラーツール。すべての処理はブラウザ内で行われます。

色を選ぶ

カラーパレット

パレットを作る

パレット作成色からパレットカラーハーモニー画像から抽出

実際に見る

ビジュアライザーコンポーネントチャート見出しロゴアイコン DaisyUIテーマ Tailwind CSS Shadcn UI Material 3 Bootstrap アプリモックアップパターンテンプレート

その他のツール

カラーピッカーコントラストチェッカー色覚シミュレーションコンバーターグラデーション生成ロゴジェネレーターマイパレット

リソース

法的情報

利用規約プライバシー Cookie

© 2026 Qolor. All rights reserved.

利用規約プライバシー Cookie

#AB66EC

Mediumpurple · Purple

Inspiration Textures Patterns Vectors Palettes Gradients Codes Details

Inspiration

他 +5 件を近日追加

Surfaces & Textures

他 +1 件を近日追加

Patterns

他 +9 件を近日追加

Vector Elements

Icon Set

Abstract Shapes

Geometric

Rings

Line Art

Emblem

カラーハーモニー

#AB66EC

#A7EC66

complementary2 colors

#66A7EC

#6866EC

#AB66EC

#EC66EA

#EC66A7

analogous5 colors

#AB66EC

#ECAB66

#66ECAB

triadic3 colors

#AB66EC

#EAEC66

#66EC68

split complementary3 colors

#AB66EC

#EC66A7

#A7EC66

#66ECAB

tetradic4 colors

#AB66EC

#EC6866

#A7EC66

#66EAEC

square4 colors

Gradients

Light Fade

Dark Depth

Complementary

Analogous

Radial

Sunset

色変換

パレットを生成

Details

コントラストチェッカー

Aaon 白

3.59:1弱い

AAAA LgAAAAAA Lg

Aaon 黒

5.84:1許容

AAAA LgAAAAAA Lg

コントラストチェッカーを開く

色覚異常シミュレーション

1型色覚異常#3085F0

2型色覚異常#4C87E9

3型色覚異常#A0809F

全色覚異常#878787

色覚異常シミュレーションを開く

バリエーション

ティント

#B677EF

#C088F1

#CA99F3

#D4AAF6

#DDBBF8

#E6CCFA

#EFDDFC

#F7EEFD

シェード

#975BCF

#834FB2

#6F4597

#5D3A7C

#4A2F62

#39254A

#281B32

#18111C

トーン

#A76AE0

#A36ED4

#9F71C7

#9B74BB

#9677AF

#9179A3

#8C7C98

#867E8C

関連色

Amethyst

Mediumorchid

Mediumslateblue

Hyacinth

Petunia

Phlox

Ube

Mauve Pink