The Slate Gray Color Code: HEX, RGB, CMYK

Few neutral colors carry as much quiet weight as slate gray.

Slate gray is a cool, mid-tone neutral that blends blue and gray in near-equal measure, sitting at hex #708090 on the color spectrum with RGB values of 112, 128, 144. It reads as calm, composed, and consistently reliable across design contexts.

The color draws from natural slate stone, which gives it both its name and its grounded character.

This article covers everything from its exact color codes and shades to how it performs in interior design, branding, fashion, and digital work, so you leave with a complete picture of how and where to use it.

Slate Gray Color Codes

Slate gray sits at a precise point on the color theory spectrum, a cool-toned neutral pulled from the RGB color model with a distinctly blue-leaning character. It’s one of the named web colors in HTML and CSS, which means you can call it by name directly in code.

Its hex code is #708090. Clean, readable, and widely recognized across design tools.

• RGB: 112, 128, 144
• HEX: #708090
• CMYK: C:22 M:11 Y:0 K:44
• HSL: 210deg, 12.6%, 50.2%

The hue angle of 210 degrees places it firmly in cool-tone territory on the color wheel. Low saturation at 12.6% keeps it muted. The 50.2% lightness puts it right at the midpoint between black and white, which is part of why it reads as such a reliable neutral in both print and screen work.

Worth noting: its LRV (Light Reflectance Value) is around 21, making it a medium-dark color. That matters in web design and interior paint choices where light reflection affects how the space or screen feels.

The closest Pantone match is PMS 7544 C. For print work using CMYK, that translates to approximately C:53 M:34 Y:22 K:10 depending on the source profile.

If you need to convert between formats, tools like an RGB to HEX converter or a HEX to RGB converter make quick work of it. For print prep, an RGB to CMYK converter is worth bookmarking. And if you’re working with HSL values in CSS, the HSL to RGB converter saves a lot of back-and-forth.

—

Slate Gray Color Palettes

Slate gray works across almost every harmony type on the color wheel. Its low saturation is what makes it so flexible. It doesn’t compete with accent colors, it just holds them together.

For building out full color palettes around slate gray, a color palette generator speeds things up considerably. You drop in the hex and it handles the harmony math.

Slate gray pairs well with cool color palettes as a base, but it also works in neutral color palettes and muted color palettes where you need depth without drama.

—

Slate Gray Shades

Slate gray covers a range of variations from near-white tints to very dark, almost charcoal tones. Each shift in lightness or saturation creates a noticeably different feel.

Some lean lighter toward silver and platinum. Others pull darker toward charcoal and near-black. The blue undertone stays consistent across most of the range.

Slate gray includes variations like very light slate, light slate gray (#778899), medium slate, the original (#708090), darker slate, and near-black dark slate gray (#2F4F4F).

Each variation differs in brightness and undertone composition. Lighter tints lean toward silver, while darker shades pull toward teal and dark slate. The blue undertone tends to strengthen as the shade darkens.

The range fits well alongside other related gray color palettes, and connects naturally to colors like blue gray, cool gray, and pewter.

—

What Are the Primary Attributes of Slate Gray?

Slate gray has five primary attributes: cool-toned hue (from its 210-degree position on the color wheel), low saturation (12.6%), medium lightness (50.2%), a consistent blue undertone, and strong neutral versatility across both warm and cool palettes.

—

How Is Slate Gray Used in Interior Design?

Slate gray works as a foundational neutral in interior design, creating calm, composed spaces that feel organized without being cold.

Designers use it for wall paint, furniture upholstery, cabinetry, and textiles to build sophisticated environments that suit modern, Scandinavian, and industrial styles equally well.

It’s reliable in bedrooms for a restful atmosphere, in home offices for focus, and in living rooms as a backdrop that lets accent colors stand out. Pair it with warm wood tones or soft textiles if you want to avoid the room feeling too clinical.

The LRV of 21 means it absorbs more light than it reflects, so lighting design matters a lot here. In north-facing rooms or low-light spaces, go lighter in the slate range.

—

What Psychology and Emotions Does Slate Gray Evoke?

Slate gray evokes calm, reliability, sophistication, and quiet strength through its association with natural stone and cool, stable tones.

Color psychology research indicates slate gray reduces visual tension, supports focused thinking, and creates composed environments that encourage both productivity and rest.

The blue undertone adds a layer of tranquility that pure gray doesn’t carry. It’s serious without being harsh. That combination is why it shows up so often in professional settings and in design work aimed at trust and credibility.

That said, in very low-light spaces or without warm accents, it can lean into the duller qualities of gray. Context matters a lot with this color.

—

How Is Slate Gray Applied in Fashion and Clothing?

Slate gray serves as a wardrobe staple in fashion, offering a polished, neutral quality through outerwear, tailored trousers, knitwear, and casual basics.

Fashion designers use it for its ability to cross seasons, pair with almost any color, and suit a wide range of skin undertones without the starkness of pure gray or charcoal.

It reads as understated on the street and clean on the runway. Works well in both workwear and casual street style. Pair it with burgundy, navy, or mustard for the most versatile combinations.

—

What Colors Complement and Contrast With Slate Gray?

Slate gray complements white, warm taupe, navy blue, dusty rose, and olive while contrasting well with mustard yellow, burnt orange, and deep burgundy.

These combinations create balanced palettes that use slate gray’s muted, cool character as either a background or a grounding anchor.

Complementary Colors

Slate Gray + White

• Color Theory Basis: High value contrast between a mid-tone cool gray and a neutral white creates clarity
• Visual Effect: Clean, minimal, and readable
• Best Applications: UI backgrounds, print design, interior walls with white trim
• Ratio Recommendations: 60% white, 40% slate gray
• Example Uses: Tech product interfaces, modern office interiors

Slate Gray + Navy Blue

• Color Theory Basis: Analogous colors sharing the same cool-hue family
• Visual Effect: Authoritative, polished, and structured
• Best Applications: Corporate branding, fashion, packaging
• Ratio Recommendations: 70% slate gray, 30% navy
• Example Uses: Finance brands, formal menswear

Slate Gray + Dusty Rose

• Color Theory Basis: Cool-warm contrast using muted tones on both sides keeps the pairing soft rather than jarring
• Visual Effect: Modern, refined, and slightly warm
• Best Applications: Wedding design, lifestyle branding, bedroom interiors
• Ratio Recommendations: 65% slate gray, 35% dusty rose
• Example Uses: Beauty packaging, Scandinavian interiors

Slate Gray + Warm Taupe

• Color Theory Basis: Cool-neutral against a warm-neutral creates gentle contrast without tension
• Visual Effect: Grounded, natural, and approachable
• Best Applications: Interior design, packaging design, editorial layouts
• Ratio Recommendations: 50% slate gray, 30% taupe, 20% ivory
• Example Uses: Natural skincare brands, residential interiors

Contrasting Colors

Slate Gray + Mustard Yellow

• Contrast Type: High value and temperature contrast
• Visual Impact: Bold and energetic without being harsh
• Best Applications: Accent walls, editorial graphics, product packaging
• Balance Strategies: Use mustard as a 10-15% accent only; slate carries the rest

Slate Gray + Burnt Orange

• Contrast Type: Cool vs. warm, medium vs. high saturation
• Visual Impact: Warm, autumnal, and grounded
• Best Applications: Autumn-themed campaigns, homeware, fashion lookbooks
• Balance Strategies: Keep burnt orange to accent use; pair with natural textures

Slate Gray + Deep Burgundy

• Contrast Type: Split-complementary
• Visual Impact: Rich, sophisticated, and formal
• Best Applications: Luxury branding, book cover design, interior accent walls
• Balance Strategies: Use burgundy sparingly; white or cream as a third anchor color helps

Color Scheme Types

• Monochromatic: Range from #D8DDE2 to #2F4F4F, using tints, shades, and tones of slate gray. Works well for minimalist design and UI systems. See also: monochrome colors.
• Analogous: Slate gray with slate blue and steel teal. Calm and cohesive. Good for tech and wellness brands. More on analogous color schemes.
• Triadic: Slate gray, dusty rose, and muted olive. A balanced three-way split across the color wheel that stays muted. See triadic color schemes.
• Split-Complementary: Slate gray with warm amber and dusty mauve. Adds variety while keeping a calm overall tone. More on split-complementary color schemes.
• Tetradic: Two complementary pairs built around slate gray. More complex to balance but gives the most color range. See tetradic color schemes.

Practical Pairing Guidelines

• 60-30-10 Rule: Slate gray as the 60% dominant color, a secondary neutral (taupe or white) at 30%, and a bold accent (mustard, burgundy, rust) at 10%
• Accent Color Strategy: One deliberate accent reads more polished than three competing highlights. Slate gray is forgiving but works best when not crowded.
• Neutral Bridging: Use ivory or warm white between slate gray and any bold color to soften the transition and keep the palette feeling intentional

Check the color contrast checker before finalizing any text-on-background pairing with slate gray. At #708090 on a white background, contrast is limited, so size and weight of type matter.

—

How Does Slate Gray Differ From Similar Cool Colors?

Slate gray differs from charcoal (darker, less blue), steel blue (more saturated), gunmetal (cooler, more metallic), and pewter (warmer, less hue) through its balance of medium lightness, low saturation, and a consistent 210-degree blue undertone.

Visual Comparison Chart

The slate blue family is also worth comparing here. Slate blue carries more saturation and reads as more of an actual color, while slate gray stays firmly in neutral territory.

—

How Do You Create Slate Gray in Different Mediums?

Create slate gray by mixing cool-toned blacks and whites with a touch of blue in paint, using hex #708090 or RGB (112, 128, 144) in digital work, and ensuring the blue undertone stays present throughout for accurate color reproduction.

Acrylic Paint

Start with titanium white as your base. Add a small amount of ivory black or carbon black for the gray base, then introduce a touch of phthalo blue or ultramarine to shift it cool.

• Base colors: Titanium white, ivory black, phthalo blue (or ultramarine)
• Mixing ratio (approximate): 60% white, 35% black, 5% blue
• Step-by-step: Mix white and black first to reach mid-gray, then add blue in tiny amounts until the undertone shifts cool
• Common mistakes: Adding too much blue, which tips it into steel blue rather than gray
• Adjustment tips: If too blue, add more white and a tiny touch of raw umber to neutralize

Oil Paint

Use ivory black, titanium white, and a minimal amount of Prussian blue or ultramarine. Oil paints shift slightly as they dry, so mix slightly cooler than your target value to compensate.

• Pigments: PW6 (titanium white), PBk9 (ivory black), PB29 (ultramarine) or PB60 (indanthrone blue)
• Technique: Build the gray first, then add blue last
• Drying note: Oils tend to deepen slightly on drying, so mix 5-10% lighter than needed

Watercolor

Payne’s gray is your closest off-the-shelf match. It reads as a cool blue-gray straight from the tube with dilution controlling the lightness.

• Pigments: Payne’s gray (semi-transparent) or a mix of ultramarine and burnt sienna with plenty of water
• Dilution: Medium wash, roughly 1 part pigment to 4-6 parts water for the mid-tone
• Layering: Build up with two light washes rather than one heavy one for more even coverage

Gouache

Same approach as watercolor but with less water. Gouache is more opaque, so the color comes out closer to the mixed value without needing to layer. Payne’s gray mixed with white gouache gets you there quickly.

• Pigments: Payne’s gray + titanium white gouache
• Ratio: Roughly 60% white, 40% Payne’s gray, adjust to target
• Note: Gouache lightens slightly on drying, so test on paper first

Print / CMYK

• Cyan: 22%
• Magenta: 11%
• Yellow: 0%
• Black: 44%
• Printing considerations: Coated paper holds the cool tone better; uncoated stock can make it feel slightly warmer and lighter. Always request a press proof.
• Pantone match: Closest is PMS 7544 C

For quick format conversions in the workflow, the CMYK to RGB converter is useful when switching between print and screen specs.

—

What Are the Best Practices for Using Slate Gray in Design?

Best practices include testing contrast ratios against all text colors, pairing it with one deliberate accent color, using it as a background rather than a foreground element, and always checking how lighting conditions affect its blue undertone before finalizing.

Designers should account for the difference between how slate gray renders on screen versus in print. The blue cast that reads as cool and clean on RGB screens can shift warmer on uncoated paper stock.

In terms of accessibility, slate gray on white (#708090 on #FFFFFF) gives a contrast ratio of about 3.65:1. That passes WCAG AA for large text but fails for body text. Don’t use it as a text color on white without checking first. Tools like the color contrast checker handle this in seconds.

For visual hierarchy, slate gray works well as a secondary or background tone. Use darker grays or near-blacks for headings and primary actions when slate gray is the base surface color.

It’s especially useful in web design for sidebar panels, card backgrounds, and footer areas where you want separation from white content zones without hard edges. Check graphic design principles and design elements for broader context on how to handle tone and contrast across a full layout.

—

What Role Does Slate Gray Play in Branding and Marketing?

Slate gray plays a grounding role in branding, communicating reliability, professionalism, and restrained sophistication to consumers. Research on color perception indicates it builds trust signals effectively, making it well-suited for financial services, tech, and healthcare brands seeking a credible, serious identity.

It’s a popular choice in brand guidelines as a secondary or neutral color that gives primary brand colors room to stand out. Used as the dominant tone, it signals expertise without the aggression of black.

For building a brand identity system around slate gray, start with a mood board to test how it interacts with your chosen typeface and accent colors before committing. A brand style guide should document the exact hex, RGB, CMYK, and Pantone values to keep the color consistent across all touchpoints.

Pairing slate gray with a sans-serif font in a similar weight class reinforces the clean, modern feel. For a more editorial look, a serif font adds contrast and warmth that balances the cool gray tone. More on font psychology if that pairing decision matters for your brand direction.

FAQ on Slate Gray Color

What is the hex code for slate gray?

The hex code for slate gray is #708090. Its RGB values are 112, 128, 144, and its HSL values sit at 210 degrees, 12.6% saturation, and 50.2% lightness. It is a named CSS color, usable directly in code as “SlateGray” or “SlateGrey.”

Is slate gray a warm or cool color?

Slate gray is a cool-toned color. Its hue angle of 210 degrees places it in blue territory on the color wheel. The blue undertone is subtle but consistent, which is why it reads as calm and composed rather than warm or earthy.

What colors go well with slate gray?

Slate gray pairs well with white, navy blue, dusty rose, warm taupe, and mustard yellow. For contrast, burnt orange and deep burgundy work strongly against it. It also sits naturally alongside other cool color palettes built around muted, low-saturation tones.

What is the difference between slate gray and charcoal?

Charcoal is significantly darker, with an LRV closer to 5 compared to slate gray’s 21. Slate gray sits at a true mid-tone with a visible blue cast. Charcoal reads almost black in low-light conditions, while slate gray holds its gray character.

What is the CMYK value of slate gray?

The CMYK breakdown for slate gray (#708090) is approximately C:22, M:11, Y:0, K:44. For Pantone-matched print work, the closest match is PMS 7544 C. Always request a press proof, since uncoated paper can shift the color slightly warmer.

What does slate gray represent psychologically?

Slate gray is associated with calm, reliability, professionalism, and quiet strength. Its cool blue undertone adds a sense of stability that pure gray lacks. In color psychology, it is frequently used in contexts where trust and credibility matter most.

How is slate gray used in interior design?

It works as a wall color, cabinetry finish, upholstery tone, and tile choice across modern, industrial, and Scandinavian styles. Its LRV of 21 means it absorbs more light than it reflects, so pairing it with warm textures or layered lighting prevents the space from feeling flat.

Is slate gray the same as slate blue?

No. Slate blue carries noticeably higher saturation and reads as an actual blue with gray influence. Slate gray stays firmly in neutral gray territory with only a subtle blue cast. The difference is clear when you place both swatches side by side.

What is the closest Pantone color to slate gray?

The closest Pantone match is PMS 7544 C, with approximate CMYK values of C:53, M:34, Y:22, K:10. This varies slightly from the standard hex-converted CMYK due to Pantone’s proprietary ink mixing system. Always verify against a physical swatch before going to print.

Can slate gray be used as a text color in web design?

With caution. Slate gray (#708090) on white gives a contrast ratio of roughly 3.65:1, which passes WCAG AA only for large text. It fails for body copy. Use a color contrast checker before applying it to any text smaller than 18px bold or 24px regular.

Conclusion

This conclusion is for an article presenting slate gray color as one of the most versatile neutral tones in design, covering everything from its CMYK and HSL values to its role in branding, fashion, and interior spaces.

Its low saturation and consistent blue undertone make it a reliable choice whether you’re building a color palette for a UI project, selecting wall paint, or anchoring a brand identity.

It pairs cleanly with muted tones, holds its own against bold accent colors, and sits comfortably across both dark and light color palettes.

Understanding its exact color codes, psychological weight, and practical applications gives you real control over how it performs in any medium. Use it with intention, and it rarely disappoints.

• Author
• Recent Posts

Bogdan Sandu

Bogdan Sandu is a seasoned designer who has been designing websites since 2008.

Renowned for his expertise in logo design and visual branding, Bogdan has developed a multitude of logos for various clients.

His skills extend to creating posters, vector illustrations, business cards, and brochures. Additionally, Bogdan's UI kits were featured on marketplaces like Visual Hierarchy and UI8.

He also wrote in the past years on sites like Design Your Way, WebDesignerDepot, WPDean, Designmodo, Speckyboy, Slider Revolution, and more.

Latest posts by Bogdan Sandu (see all)

• What Is a Display Typeface and How to Use It Right - 17 August 2026
• The Loom Logo History, Colors, Font, And Meaning - 16 August 2026
• Canva Free vs Pro: Is the Upgrade Worth It? - 14 August 2026