#28528C 海底書斎ブルー

    カラーコード、バリエーション、ハーモニーを生成し、コントラスト比を確認。

    カラー変換

    HEX

    #28528c

    HEX
    #28528c
    HSL
    215, 56, 35
    RGB
    40, 82, 140
    XYZ
    9, 8, 26
    CMYK
    71, 41, 0, 45
    LUV
    35,-10,-46
    LAB
    35, 6, -37
    HWB
    215, 16, 45

    バリエーション

    このセクションの目的は、選択した色のティント(純白を追加)とシェード(純黒を追加)を10%刻みで正確に生成することです。

    プロのヒント: ホバー状態や影にはシェードを、ハイライトや背景にはティントを使用。

    シェード

    ベースカラーに黒を追加して作成された暗いバリエーション。

    ティント

    ベースカラーに白を追加して作成された明るいバリエーション。

    一般的な使用例

    • UIコンポーネントの状態(ホバー、アクティブ、無効)
    • 影とハイライトで深みを作る
    • 一貫したカラ―システムの構築

    デザインシステムのヒント

    これらのバリエーションは、統一されたカラーパレットの基盤を形成します。プロジェクト全体で一貫性を保つためにエクスポートしてください。

    カラ―コンビネーション

    各ハーモニーには独自のムードがあります。ハーモニーを使用して、うまく組み合わせるカラ―コンボをブレインストーミング。

    使い方

    任意の色をクリックしてそのHex値をコピー。これらの組み合わせは、視覚的なハーモニーを生み出すことが数学的に証明されています。

    重要性

    カラーハーモニーはバランスを作り、デザインに特定の感情を呼び起こします。

    補色

    色相が180度異なる色とその反対色。高いコントラスト。

    #28528c
    最適な用途: インパクトのあるデザイン、CTA、ロゴ

    分割補色

    メインカラーの反対側から色相が±30度の2つの隣接色。ストレートな補色のように大胆だが、より多用途。

    最適な用途: 鮮やかでバランスの取れたレイアウト

    トライアディック

    色相が120度ずつ離れた3色。1色を支配的にし、他をアクセントとして使用するのがベスト。

    最適な用途: 遊び心のある、エネルギッシュなデザイン

    類似色

    色相が30度離れた同じ明度と彩度の3色。スムーズな移行。

    最適な用途: 自然にインスパイアされた、落ち着いたインターフェース

    モノクロマティック

    同じ色相で明度が±50%の3色。微妙で洗練された。

    最適な用途: ミニマリストで洗練されたデザイン

    テトラディック

    2組の補色が、色相で60度離れて配置されています。

    最適な用途: 豊かで多様なカラースキーム

    色彩理論の原則

    バランス

    1つの支配的な色を使用し、補助色でサポートし、アクセントは控えめに。

    コントラスト

    読みやすさとアクセシビリティのために十分なコントラストを確保。

    ハーモニー

    色は統一された視覚体験を作り出すために協調するべき。

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

    色の組み合わせをテストして、テキストの読みやすさのためにWCAGアクセシビリティ基準を満たしていることを確認します。

    テキストカラー
    背景色
    コントラスト
    1.00
    Fail
    非常に悪い
    小さなテキスト
    ✖︎
    大きなテキスト
    ✖︎
    WCAG基準
    AA:通常のテキストの最小コントラスト比は 4.5:1、大きなテキストの最小コントラスト比は 3:1。ほとんどのウェブサイトで必須。
    AAA:通常のテキストに対する強化されたコントラスト比は 7:1、 大きなテキストに対するのは4.5:1。最適なアクセシビリティのために推奨。
    すべてのテキストサイズに対してコントラストが不十分です - WCAG基準に不適合です。

    高度なコントラストチェッカー

    スライダーで微調整、複数のプレビューなど

    誰もが天才です。しかし、魚の木登り能力で判断すれば、一生自分が愚かだと思って生きるでしょう。

    - Albert Einstein

    技術フォーマット

    実用的なフォーマット

    カラー分析

    色覚シミュレーター

    クリエイティブな側面

    よくある質問

    #28528C は何色ですか?
    #28528C は 海底書斎ブルー で – 深く沈んだ藍色にわずかな鋼の冷たさを帯びた色合いで、濃密かつ澄んだ視覚印象を与えます。落ち着いた知性と堅実さを感じさせ、場を引き締める静かな権威を喚起します。
    海底書斎ブルー は何を象徴しますか?
    専門性と信頼(ビジネス), 深い思索と知性(学術), 海や航海の象徴(航海・探検), 静寂と保守(クラシックな格式), 控えめな権威(政府・公共機関). 西洋では海軍制服や学術的な威厳と結びつけられ、信頼や権威の色と受け取られます。日本や東アジアでは藍色の系譜につながり、織物や伝統工芸において落ち着きと歳月を感じさせる色です。スカンジナビア/北欧では建築やインテリアで寒冷で洗練された美意識を表す色として用いられることが多いです。
    デザインで海底書斎ブルー はどこで使われますか?
    視覚的に注意を引きすぎず安定感を提供するため、情報重視の場面で集中力を高めます。暖色より反応を抑えるためユーザーの警戒心を下げつつ専門性を伝えます。
    海底書斎ブルーに合う色は何ですか?
    colorCode.seoFaqPairingAnswer #CC7A28: 補色の関係で視覚的コントラストが強く、CTAやアクセントに使うと即時の注意喚起が可能(補色)。. #1F3A66: 同系のひとつ暗いトーンで重なりによる奥行きを作り、グラデーションや影に使うと落ち着いた階層が生まれる(類似色)。. #7A2852: トライアドに近い深みのあるマゼンタで、暖かさと高級感を加えつつ調和的な色相差を生む(トライアド)。.
    海底書斎ブルーは気分にどう影響しますか?
    落ち着いた自信と静かな権威感 見る人に冷静な安心感と信頼を与える colorCode.seoFaqMoodTraits
    どの業界で海底書斎ブルーが使用されていますか?
    colorCode.seoFaqIndustriesAnswercolorCode.seoFaqIndustriesArchetypes
    海底書斎ブルーの歴史は何ですか?
    この濃い鋼青に近い色は、18世紀に発明されたプルシアンブルー(ベルリンブルー)や、19世紀のコバルト系顔料が普及して以降、画家や繊維職人によって調整されてきました。鉄や銅を含む媒材で青を深め、土系の顔料で彩度を抑える技術がこの濃色を生み出しました。
    デザインで海底書斎ブルーを使用する方法は?
    コントラストとテクスチャのバランスを保ち、面積比でのアクセント配分を守ること。colorCode.seoFaqDesignDo
    海底書斎ブルーはアクセシブルですか?
    colorCode.seoFaqAccessibilityAnswer 通常のテキストと大きなテキストの両方でWCAG AAに準拠しています。