Sage Green Color Codes for Logo Design
Why no single official sage green color code exists, how to define a sage hex value for a vector logo, and how to build sage green gradients that export cleanly.
Contents
If you are looking for one official sage green color code, there isn't one. Sage is a descriptive name for a muted, grayish green, not a standardized color. Color references, paint brands and design tools each publish their own versions, and they differ. For a logo, the useful answer is to choose one specific value, record it in every color model your artwork needs, and build any gradients from that documented base.
What "Sage Green" Means as a Color
Sage describes a green with low saturation. It is softened toward gray, and often warmed slightly toward yellow or cooled slightly toward blue. Because the name covers a range rather than a point, two designers can both say "sage" and mean visibly different colors. That matters for a logo, where every file, printed piece and screen should show the same color.
Example Sage Green Hex Codes
The values below are examples of muted gray-greens across the sage range. They are starting points, not an authoritative standard. No source was supplied to confirm which of them any particular reference names "sage." The RGB values are direct conversions of each hex code.
| Description | Hex | RGB |
| Mid sage, leaning green | #9CAF88 | 156, 175, 136 |
| Warm sage, leaning gray-olive | #B2AC88 | 178, 172, 136 |
| Light warm sage | #BCB88A | 188, 184, 138 |
| Pale sage tint | #C8D5B9 | 200, 213, 185 |
| Deep sage shade | #77815C | 119, 129, 92 |
Before adopting any of these, view it on more than one screen and next to the other brand colors. Muted greens can read as gray, olive or mint depending on what surrounds them.
Recording Sage Green Across Color Models
A hex code covers screens only. A complete logo color specification usually lists the same color in several models, and each model has its own caveats:
- Hex and RGB: used for websites, apps and screen graphics. Hex is a compact way of writing an RGB value, so the two describe the same color.
- CMYK: used for process printing. There is no single correct CMYK value for a given hex code. The conversion depends on the color profile and the printing conditions, so confirm it with your printer or a defined profile rather than relying on a generic converter.
- Spot color, such as a Pantone match: used when exact print consistency matters. Choose the match visually from a physical guide or the vendor's official tools. The nearest digital value may not look identical on paper.
- Other outputs, such as paint, signage vinyl or embroidery thread: these use their own swatch systems and need separate matching.
Once the values are chosen, store them as named global swatches in the vector source file. That way the color can be adjusted everywhere at once instead of being edited object by object.
Building Sage Green Gradients for a Logo
Sage works well in gradients because its low saturation keeps the transitions subtle. In vector artwork, a gradient is defined by color stops along a path. Each stop should use a documented value, not a color picked by eye. Common approaches include:
- Tonal gradient: move from a deeper sage shade to a lighter sage tint of the same hue. This adds depth while keeping the color identity intact.
- Analogous gradient: shift from sage toward a neighboring muted color, such as a soft olive or a gray-blue. This adds movement without high contrast.
- Neutral gradient: blend sage into an off-white or warm gray for a quieter, more organic effect.
Keep the number of stops small and write each stop's value into the brand guidelines. A gradient that cannot be described in a specification is hard to reproduce consistently.
Always Provide a Flat Sage Version
Many reproduction methods cannot render gradients faithfully, including screen printing, embroidery, vinyl cutting, engraving and some single-color stamps. A gradient sage logo should therefore come with a flat version that uses one specified sage value. One-color and reversed versions are also useful. Choose the flat color deliberately; it is often the gradient's midpoint or its dominant tone, so the logo still reads as the same brand without the blend.
Vector Gradients, Embedded Rasters and Previews
How a gradient is stored affects whether the color can still be edited later. A native vector gradient keeps its color stops editable. Complex effects, such as gradient meshes, blurs or certain blend modes, may be flattened into embedded raster images when the file is exported to some formats. A file can carry a vector extension and still contain a rasterized gradient inside it, and a PNG or JPG preview contains no editable color stops at all. A file's name or extension does not prove that its sage gradient is editable. Open the file in a vector editor and check whether the gradient stops can be selected and changed.
SVG is a common delivery format for screen use. As a precaution, test any exported gradient in the environments where it will appear, such as browsers, slide software and email clients, because rendering support varies between tools.
Contrast and Legibility
Sage sits in the middle-to-light range of values, so text or fine details in sage may lack contrast on white, and white text on a mid sage may also be hard to read. Lighter sage tints make this worse. Check every intended pairing with a contrast-checking tool, especially where the logo includes a wordmark or tagline. Plan a deeper sage shade or a dark neutral for small sizes and text.
Limits of This Guide
No verified source data was provided for this article. The hex examples above are illustrative and are not confirmed as any organization's official "sage." No CMYK conversions, spot-color matches or contrast measurements are given, because these depend on profiles, physical swatches and testing that were not available. Confirm those values with your printer, the color-system vendor's official tools and your own contrast checks before finalizing a logo specification.