Vista Blue

HEX: #7C9ED9 | Modern Palette

On White
2.71:1
FAIL
On Black
7.75:1
PASS

Color Specifications

HEX
#7C9ED9
RGB
124, 158, 217
HSL
218°, 42% ,85%
CMYK
42.86, 27.19, 0, 14.9

About Vista Blue

Vista Blue (#7C9ED9) is a color with RGB(124, 158, 217) and HSL(218.06°, 42.86%, 85.1%). In design, it fits Cool styles and is suitable for Text, Background, Print. Its complementary color is #D9B77C, which creates strong contrast. Its triadic palette includes #D97C9E and #9ED97C. The name comes from Vista Blue (English).

  • HEX: #7C9ED9
  • RGB: 124, 158, 217
  • HSL: 218.06°, 42.86%, 85.1%
  • Style: Cool
  • Use case: Text, Background, Print
  • Complementary color: #D9B77C
  • Triadic colors: #D97C9E, #9ED97C
  • The name comes from Vista Blue (English).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Vista Blue #7C9ED9 is used in Monochromatic, Neutral + Accent, Analogous, 3 + 1 + 1 palettes, giving designers ready-made combinations for backgrounds, surfaces, accents, and interface elements.

Monochromatic Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
 
 
 
VISTA BLUE
 
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
 
 
VISTA BLUE
 
 
Analogous Five hues drifting across a 60° arc — naturally harmonious and pleasing to the eye.
 
 
 
 
 
3 + 1 + 1 Three analogous base colors, one complementary accent, one dark anchor — bold yet balanced.
 
 
 
 
 

Color Harmonies

Vista Blue #7C9ED9 pairs with #D9B77C as its complementary color, and #D97C9E and #9ED97C in triadic combinations. These harmony relationships help create balanced color combinations for UI, branding, and design work.

Complementary

The color directly opposite on the color wheel — creates maximum contrast and vibrance.

VISTA BLUE
Analogous

Colors adjacent on the wheel — naturally harmonious and pleasing to the eye.

VISTA BLUE
Triadic

Three colors equally spaced 120° apart — bold, balanced, and visually rich.

VISTA BLUE
Split-Complementary

Two colors flanking the complement — high contrast with less tension than full complementary.

VISTA BLUE
Tetradic (Square)

Four colors at 90° intervals — rich variety, best when one color dominates.

VISTA BLUE
Monochromatic

Shades and tints of the same hue — cohesive, elegant, and easy to work with.

VISTA BLUE

Shades & Tints

The shade and tint range for Vista Blue #7C9ED9 moves from dark #060B14 tones through the base color to lighter #EBF0F9 tones, making it useful for depth, hierarchy, and background variation.

VISTA BLUE

Color Characteristics

Mood
Style
Cool
Use case
Text Background Print

Accessibility Simulation

Deuteranopia #9595D9
Protanopia #9B9BD9
Tritanopia #6EA7A7
Achromatopsia #9D9D9D

Frequently Asked Questions

Vista Blue (#7C9ED9) is a color with RGB(124, 158, 217) and HSL(218.06°, 42.86%, 85.1%).

#7C9ED9 pairs strongly with #D9B77C as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

#7C9ED9 is suitable for Text, Background, Print and works well with Cool styles.

The name Vista Blue is linked to Vista Blue from English, meaning A shade of blue reminiscent of a clear sky or distant view..

Name, History & Etymology

Origin Word Vista Blue
Meaning A shade of blue reminiscent of a clear sky or distant view.
Language English
First Recorded Use Late 20th Century

History

The term 'vista' comes from Italian, meaning 'view' or 'sight,' and entered English in the 17th century. 'Blue' is one of the oldest color terms, with roots in Proto-Indo-European. The combination 'Vista Blue' evokes a sense of open spaces, clear skies, or distant horizons, often associated with tranquility and expansiveness. It gained particular prominence as a color option for vehicles, notably Ford Mustangs in the late 1990s and early 2000s, which helped popularize the specific shade and name.

First Recorded Use

The specific color name 'Vista Blue' likely emerged with the proliferation of digital color palettes and standardized color naming conventions, particularly in the automotive and design industries. While 'vista' and 'blue' have ancient origins, their combination as a specific color name is more modern.

Cultural Associations

In Western cultures, blue is often associated with calmness, stability, wisdom, and reliability. The 'vista' component adds a layer of aspiration, freedom, and natural beauty. The specific shade #7c9ed9 is a medium, somewhat muted blue, which can be perceived as sophisticated and serene. Its use in automotive design often aimed to convey a sense of sportiness combined with elegance.

Similar Named Colors
Dark Pastel Blue #779ECB ΔE 2.71
Little Boy Blue #6CA0DC ΔE 3.85
Light Cobalt Blue #88ACE0 ΔE 4.04
Cornflower Blue #6495ED ΔE 4.40

Code Snippets

/* Background */
.element {
    background-color: #7C9ED9;
}

/* Text */
.element {
    color: #7C9ED9;
}

/* Border */
.element {
    border: 1px solid #7C9ED9;
}

/* Linear gradient to complementary */
.element {
    background: linear-gradient(
        to right,
        #7C9ED9,
        #E9DDC9
    );
}

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #7C9ED9,
        #E9DDC9
    );
}

// SCSS variable
$vista-blue: #7C9ED9;

// With RGB channels (useful for rgba() usage)
$vista-blue-r: 124;
$vista-blue-g: 158;
$vista-blue-b: 217;

// Usage
.element {
    background-color: $vista-blue;
    color: rgba($vista-blue-r, $vista-blue-g, $vista-blue-b, 0.8);
}