EllyTools

画像ツール

計算ツール

テキストツール

カラーツール

ファイルツール

便利ツール

カラーパレット生成

好きな色から調和するカラーパレットを自動生成

HSL(239, 84%, 67%) · rgb(99, 102, 241)

Analogous パレット

#64ADF2

rgb(100, 173, 242)

#6366F1

rgb(99, 102, 241)

#A864F2

rgb(168, 100, 242)

#EF64F2

rgb(239, 100, 242)

サンプル見出し

実際のデザインでこのカラーパレットがどう見えるか確認できます。

使い方

関連ツール

こんな方におすすめ

    EllyToolsが選ばれる理由

    100%無料&無制限

    登録不要、制限なし。何度でもお使いいただけます。

    プライバシー最優先

    すべての処理はブラウザ内で行われます。ファイルがデバイスの外に出ることはありません。

    インストール不要

    デスクトップ、タブレット、スマートフォンなど、あらゆるデバイスのブラウザで直接動作します。

    高速&安定

    最新のブラウザ技術による即座の結果。

    Color Palette Generator: Building Cohesive Color Schemes

    A great color palette is more than 'colors that look nice together' — it's a small set of carefully chosen hues that work across light/dark modes, accessibility requirements, and brand needs. This generator helps you build one from scratch or from an inspiration image.

    A typical web/app palette has 5–9 colors: a primary brand color, 1–2 accents, neutral grays for backgrounds and text, and semantic colors for success/warning/error. The trick is making them all feel related — using harmony rules (analogous, complementary, triadic) keeps things cohesive.

    Color harmony types

    HarmonyDescriptionFeel
    AnalogousHues next to each other on the wheelCalm, harmonious
    ComplementaryHues opposite on the wheelHigh contrast, vibrant
    Split-complementaryBase + two near-oppositeVibrant but balanced
    TriadicThree evenly spaced huesVibrant, balanced
    MonochromaticOne hue at varied lightnessSubtle, sophisticated

    Extended FAQ

    How many colors should a palette have?

    5–9 for most projects. More than that and you're just adding noise; fewer and you'll struggle for visual variety. A common starter: 1 primary, 1 accent, 3–4 neutral grays, 3 semantic colors.

    Are my palettes stored?

    No — runs entirely in your browser.