ImageColorPicker.com

    #082567 Mariner's Cloak

    Generate color codes, variations, harmonies, and check contrast ratios.

    Color Conversion

    #082567Mariner's Cloak

    HEX
    #082567
    HSL
    222, 86, 22
    RGB
    8, 37, 103
    XYZ
    3, 2, 13
    CMYK
    92, 64, 0, 60
    LUV
    17,-4,-42
    LAB
    17, 18, -41
    HWB
    222, 3, 60

    About this color

    Oxford Midnight
    Twilight Indigo
    Deep Harbor Navy

    Calm authority with contemplative restraint

    A dense, low‑luminance indigo‑blue with a cool, almost inky depth and a hint of violet leaning in the shadows. It feels like steady authority at dusk — calm, watchful, and quietly formidable.

    Designer tip: Use #082567 as a primary header/nav background and pair it with a warm amber CTA (#FFB547) and off‑white body text (≈EDEDE6) to create an immediate, accessible contrast while keeping the palette anchored and refined.

    Best use case: Primary brand color for a premium financial or maritime services website header and dashboard chrome where trust, legibility, and a serious tone are essential.

    authoritative
    calm
    maritime
    contemplative
    resilient

    Psychology

    Psychological traits and emotional associations

    trustworthy
    competent
    measured
    reserved
    stable

    Effect

    In a space or interface, this shade grounds other elements and reduces perceived visual noise, encouraging focus and deliberation. It also elevates perceived professionalism and can make supporting accents feel more luxurious when used sparingly.

    Emotional impact

    Viewers typically feel reassured and focused, perceiving competence and seriousness.

    Meaning & symbolism

    Cultural symbolism and significance

    authority and trust
    navigation and maritime legacy
    professionalism
    depth and introspection
    nighttime vigilance

    Cultural significance

    In Western corporate contexts the shade reads as dependable—common in finance and government uniforms. In Japan, deep indigo relates to aizome textile traditions and craftsmanship, carrying connotations of durability and artisanal value. In coastal cultures (e.g., Mediterranean and North Atlantic), such dark navy tones evoke seafaring, navigation, and practical utility.

    Positive associations

    Associated with trust and authority in Western business and law settings; in Japan it connotes craft and tradition (aizome).

    Negative associations

    Can read as overly conservative or institutional in some creative youth cultures in Western markets, and in some regions very dark blues can be associated with mourning uniforms or formality (Western military/naval contexts).

    Design applications

    How this color is used across different fields

    Corporate website hero / header

    Use #082567 as the full-bleed hero background with large off‑white type for instant authority and clear CTA contrasts; it supports legibility while signaling stability.

    Finance or legal brand identity

    As a primary brand color on logos, business cards, and stationery, it communicates reliability and professional seriousness without feeling black‑flat.

    Product packaging for premium hardware

    Applied to rigid boxes or matte labels, the inky depth reads as durable and high‑end, especially when paired with metallic accents.

    App/dashboard chrome

    Use as top navigation and sidebars to frame content—its low luminance reduces visual fatigue and helps data surfaces pop.

    Interior accent walls in lobbies or meeting rooms

    A single wall in this hue creates a focused, intimate atmosphere that reads sophisticated yet approachable when balanced with warm woods and soft lighting.

    Design guidance

    Practical tips for using this color effectively in your designs

    Do this

    • + Use as a dominant element for headers, primary buttons, or large backgrounds and pair with a warm accent (e.g., amber) to create immediate readable contrast.
    • + Reserve lighter tints or neutral off‑whites for body copy and secondary surfaces to maintain legibility and reduce eye strain.
    • + Introduce this hue at large scale first (e.g., brand mark or header) then add small bright accents for action states to preserve perceived sophistication.

    Avoid this

    • - Don’t set small, low‑weight text in this color on dark backgrounds — contrast will fail for accessibility.
    • - Avoid combining it with overly saturated cool neons (e.g., electric lime) which produce an uneasy, discordant clash.
    • - Don’t use it as the only color across a product interface — it will flatten hierarchy and make interactions ambiguous.

    Fundamentals: Maintain clear contrast and hierarchy: use #082567 as grounding background or anchor, then rely on bright warm accents and light neutrals to create readable, actionable layers.

    Overuse risk: When this color dominates a design it can make the experience feel heavy, somber, and non‑inviting; visual hierarchy flattens and accents lose impact. Strategic accents and lighter neutrals are required to keep the design readable and emotionally balanced.

    Brand fit

    Industries and brand archetypes that align with this color

    Private banking and wealth management
    Maritime and shipping services
    Enterprise B2B software (SaaS)
    The Ruler
    The Sage

    Trust level

    high

    Seriousness

    serious

    Trend

    classic
    Deep indigo/navy shades remain a staple in corporate and luxury palettes and are steady rather than fad‑driven; their usage is stable with periodic upticks when brands seek a more sober, premium look. Usage is likely to remain consistent as a timeless anchor color across digital and physical mediums.
    Royal Navy service dress uniforms and heraldry (naval coats)
    High‑end watch dials from brands such as IWC and Omega that use deep navy faces
    Traditional Japanese aizome indigo textiles and contemporary indigo denim from Japanese denim mills

    Color pairing

    Colors that complement and enhance this shade

    Typography hints: For reversed copy on #082567 use a humanist sans (e.g., Inter, Museo Sans, or FF Meta) in 600–700 weight for headings and 400–500 for body; keep tracking slightly tight for headings (‑0.01em) and use an off‑white (EDEDE6) for better warmth. For print editorial pairing, a transitional serif (e.g., Georgia/Times) in bold for headlines and a medium sans for captions creates a refined contrast.

    Historical significance

    The story and heritage of this color

    Deep indigo and navy tones have roots in plant-derived indigo dye and later in synthesized pigments; indigo cloth has been used for centuries across Asia and Africa, while Prussian Blue and other iron‑based pigments popularized darker ultramarine varieties in Europe after the 18th century. Naval uniforms and maritime flags standardized deep blues during the 18th–19th centuries, cementing the color's association with seafaring authority and institutional dress.

    In art and architecture, deep blues have been used to convey night, distance, and dignity — from Renaissance ultramarine skies to 20th‑century modernist corporate interiors that favored strong navy tones for boardrooms and façades. In fashion, the navy blazer and indigo denim became durable style signifiers, bridging utility and elegance across classes.

    Today this specific inky indigo is valued for digital and physical brands that need a serious, contemporary voice: it translates well to screens, reproduces consistently in print, and pairs with both warm accent colors and neutral palettes, maintaining cultural resonance while feeling modern and versatile.

    Tags

    deep indigo
    navy
    trust
    branding
    web UI
    luxury
    autumn
    winter
    minimal
    professional

    mood

    authoritative, calm

    family

    indigo + cool

    usage

    web, brand identity, interior accents

    style

    modern, refined, minimal

    inspiration

    sheltered harbor, midnight sky

    Variations

    The purpose of this section is to accurately produce tints (pure white added) and shades (pure black added) of your selected color in 10% increments.

    Pro Tip: Use shades for hover states and shadows, tints for highlights and backgrounds.

    Shades

    Darker variations created by adding black to your base color.

    Tints

    Lighter variations created by adding white to your base color.

    Common Use Cases

    • UI component states (hover, active, disabled)
    • Creating depth with shadows and highlights
    • Building consistent color systems

    Design System Tip

    These variations form the foundation of a cohesive color palette. Export them to maintain consistency across your entire project.

    Color Combinations

    Each harmony has its own mood. Use harmonies to brainstorm color combos that work well together.

    How to Use

    Click on any color to copy its hex value. These combinations are mathematically proven to create visual harmony.

    Why It Matters

    Color harmonies create balance and evoke specific emotions in your designs.

    Complement

    A color and its opposite on the color wheel, +180 degrees of hue. High contrast.

    #082567
    Best for: High-impact designs, CTAs, logos

    Split-complementary

    A color and two adjacent to its complement, +/-30 degrees of hue from the value opposite the main color. Bold like a straight complement, but more versatile.

    Best for: Vibrant yet balanced layouts

    Triadic

    Three colors spaced evenly along the color wheel, each 120 degrees of hue apart. Best to allow one color to dominate and use the others as accents.

    Best for: Playful, energetic designs

    Analogous

    Three colors of the same luminance and saturation with hues that are adjacent on the color wheel, 30 degrees apart. Smooth transitions.

    Best for: Nature-inspired, calming interfaces

    Monochromatic

    Three colors of the same hue with luminance values +/-50%. Subtle and refined.

    Best for: Minimalist, sophisticated designs

    Tetradic

    Two sets of complementary colors, separated by 60 degrees of hue.

    Best for: Rich, diverse color schemes

    Color Theory Principles

    Balance

    Use one dominant color, support with secondary, and accent sparingly.

    Contrast

    Ensure sufficient contrast for readability and accessibility.

    Harmony

    Colors should work together to create a unified visual experience.

    Color Contrast Checker

    Test color combinations to ensure they meet WCAG accessibility standards for text readability.

    Text Color
    Background Color
    Contrast
    1.00
    Fail
    Very poor
    Small text
    ✖︎
    Large text
    ✖︎
    WCAG Standards
    AA:Minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text. Required for most websites.
    AAA:Enhanced contrast ratio of 7:1 for normal text and 4.5:1 for large text. Recommended for optimal accessibility.
    Insufficient contrast for all text sizes - fails WCAG standards.

    Advanced Contrast Checker

    Fine-tune with sliders, multiple previews & more

    Everybody is a Genius. But If You Judge a Fish by Its Ability to Climb a Tree, It Will Live Its Whole Life Believing that It is Stupid.

    - Albert Einstein

    Technical Formats

    Practical Formats

    Color Analysis

    Blindness Simulator

    Creative Aspects

    Frequently asked questions