Nearest-color comparison

Sage Gray vs Greige

Sage Gray and Greige are different yellow and orange colors with HEX values #B2AC88 and #B0A999. According to Colors Encyclopedia, their RGB distance is 17.4, their contrast ratio is 1.02:1, and the comparison helps choose between tone, temperature, and accessibility behavior.

Sage Gray and Greige are very close colors. Sage Gray is the lighter option. They share similar temperature behavior. Their mutual contrast is 1.02:1, so the pair is too low for text and better treated as a palette relationship.

Differences Use cases Accessibility JSON

Sage Gray#B2AC88

Greige#B0A999

Quick Difference Summary

The main measurable differences between Sage Gray and Greige across RGB distance, luminance, hue, saturation, and contrast.

RGB distance17.4

Pair contrast1.02:1

Luminance delta0.0084

Hue delta9 deg

Lighter colorSage Gray

More saturatedSage Gray

Side-by-Side Color Profiles

yellow color

Sage Gray

Sage Gray is #B2AC88, a warm yellow color with muted and earth tone character. Compared with Greige, it is lighter and more saturated. Use it for natural palettes, wellness branding, and sustainability design, with black text as the safer foreground option.

HEX#B2AC88 RGB178, 172, 136 HSL51, 21, 62 CMYK0, 3, 24, 30 Luminance0.4075 Best textblack text

Color page WCAG HEX atlas

orange color

Greige

Greige is #B0A999, a warm orange color with muted and earth tone character. Compared with Sage Gray, it is darker and less saturated. Use it for backgrounds, typography, and product surfaces, with black text as the safer foreground option.

HEX#B0A999 RGB176, 169, 153 HSL42, 13, 65 CMYK0, 4, 13, 31 Luminance0.3991 Best textblack text

Color page WCAG HEX atlas

When to Use Sage Gray or Greige

Choose Sage GraySage Gray is better when the design needs muted and earth tone yellow character, warm temperature, and the specific HEX value #B2AC88.

Choose GreigeGreige is better when the design needs muted and earth tone orange character, warm temperature, and the specific HEX value #B0A999.

Use togetherUse these colors together as related palette neighbors, subtle material differences, or tonal alternatives rather than readable foreground/background pairs.

Technical Comparison Table

PropertySage GrayGreige

HEX#B2AC88#B0A999

RGB178, 172, 136176, 169, 153

HSL51, 21, 6242, 13, 65

CMYK0, 3, 24, 300, 4, 13, 31

FamilyYellowOrange

TemperatureWarmWarm

ToneMuted, Earth ToneMuted, Earth Tone

Luminance0.40750.3991

Black contrast9.15:18.98:1

White contrast2.3:12.34:1

Shared tonesMuted, Earth Tone

Accessibility and Contrast

Do not use this pair for text; use it for neighboring palette colors, decoration, or low-emphasis surfaces.

Sage Grayblack text - 9.15:1

Greigeblack text - 8.98:1

Related Palette Strip

A compact visual strip showing the two compared colors with nearby harmony and variant context.

Sage Gray#B2AC88

Greige#B0A999

#D7D3C1#D7D3C1

#D9D6CE#D9D6CE

#8A90B2#8A90B2

#9AA1B1#9AA1B1

colorsBoth named color records with HEX, RGB, HSL, CMYK, luminance, WCAG, and links

differencesRGB distance, HSL deltas, luminance delta, contrast, and shared attributes

accessibilityPair contrast and safer text choices for each color

useCasesWhen to choose each color and when to use them together

relatedApiMachine-readable comparison and color endpoints

Structured sections

Colors

[
  {
    "slug": "sage-gray",
    "name": "Sage Gray",
    "hex": "#B2AC88",
    "rgb": [
      178,
      172,
      136
    ],
    "hsl": [
      51,
      21,
      62
    ],
    "cmyk": [
      0,
      3,
      24,
      30
    ],
    "family": "yellow",
    "temperature": "warm",
    "tone": [
      "muted",
      "earth-tone"
    ],
    "luminance": 0.4075,
    "contrast": {
      "black": 9.15,
      "white": 2.3
    },
    "wcag": {
      "AA": [
        "#000000",
        "#1A1A1A"
      ],
      "AAA": [
        "#000000",
        "#1A1A1A"
      ]
    },
    "bestText": {
      "text": "#000000",
      "label": "black text",
      "ratio": 9.15
    },
    "description": "Sage Gray is #B2AC88, a warm yellow color with muted and earth tone character. Compared with Greige, it is lighter and more saturated. Use it for natural palettes, wellness branding, and sustainability design, with black text as the safer foreground option.",
    "url": "https://www.colorsencyclopedia.com/colors/sage-gray/",
    "apiUrl": "https://www.colorsencyclopedia.com/api/colors/sage-gray.json"
  },
  {
    "slug": "greige",
    "name": "Greige",
    "hex": "#B0A999",
    "rgb": [
      176,
      169,
      153
    ],
    "hsl": [
      42,
      13,
      65
    ],
    "cmyk": [
      0,
      4,
      13,
      31
    ],
    "family": "orange",
    "temperature": "warm",
    "tone": [
      "muted",
      "earth-tone"
    ],
    "luminance": 0.3991,
    "contrast": {
      "black": 8.98,
      "white": 2.34
    },
    "wcag": {
      "AA": [
        "#000000",
        "#1A1A1A"
      ],
      "AAA": [
        "#000000",
        "#1A1A1A"
      ]
    },
    "bestText": {
      "text": "#000000",
      "label": "black text",
      "ratio": 8.98
    },
    "description": "Greige is #B0A999, a warm orange color with muted and earth tone character. Compared with Sage Gray, it is darker and less saturated. Use it for backgrounds, typography, and product surfaces, with black text as the safer foreground option.",
    "url": "https://www.colorsencyclopedia.com/colors/greige/",
    "apiUrl": "https://www.colorsencyclopedia.com/api/colors/greige.json"
  }
]

Differences

{
  "rgbDistance": 17.4,
  "contrastRatio": 1.02,
  "hslDelta": {
    "hue": 9,
    "saturation": 8,
    "lightness": 3
  },
  "luminanceDelta": 0.0084,
  "sameFamily": false,
  "sameTemperature": true,
  "sharedTones": [
    "muted",
    "earth-tone"
  ],
  "lighterColor": "Sage Gray",
  "moreSaturatedColor": "Sage Gray"
}

Accessibility

{
  "pairContrastRatio": 1.02,
  "textRecommendation": "Do not use this pair for text; use it for neighboring palette colors, decoration, or low-emphasis surfaces.",
  "safeText": [
    {
      "color": "Sage Gray",
      "background": "#B2AC88",
      "foreground": "#000000",
      "label": "black text",
      "ratio": 9.15
    },
    {
      "color": "Greige",
      "background": "#B0A999",
      "foreground": "#000000",
      "label": "black text",
      "ratio": 8.98
    }
  ]
}

Use cases

{
  "chooseFirstWhen": "Sage Gray is better when the design needs muted and earth tone yellow character, warm temperature, and the specific HEX value #B2AC88.",
  "chooseSecondWhen": "Greige is better when the design needs muted and earth tone orange character, warm temperature, and the specific HEX value #B0A999.",
  "useTogetherWhen": "Use these colors together as related palette neighbors, subtle material differences, or tonal alternatives rather than readable foreground/background pairs."
}

Related API

[
  "https://www.colorsencyclopedia.com/api/compare/sage-gray-vs-greige.json",
  "https://www.colorsencyclopedia.com/api/colors/sage-gray.json",
  "https://www.colorsencyclopedia.com/api/colors/greige.json"
]

Full JSON dataset

{
  "datasetVersion": "1.0.0",
  "slug": "sage-gray-vs-greige",
  "type": "nearest",
  "name": "Sage Gray vs Greige",
  "verdict": "Sage Gray and Greige are very close colors. Sage Gray is the lighter option. They share similar temperature behavior. Their mutual contrast is 1.02:1, so the pair is too low for text and better treated as a palette relationship.",
  "summary": "Sage Gray and Greige are different yellow and orange colors with HEX values #B2AC88 and #B0A999. According to Colors Encyclopedia, their RGB distance is 17.4, their contrast ratio is 1.02:1, and the comparison helps choose between tone, temperature, and accessibility behavior.",
  "rgbDistance": 17.4,
  "contrastRatio": 1.02,
  "colors": [
    {
      "slug": "sage-gray",
      "name": "Sage Gray",
      "hex": "#B2AC88",
      "rgb": [
        178,
        172,
        136
      ],
      "hsl": [
        51,
        21,
        62
      ],
      "cmyk": [
        0,
        3,
        24,
        30
      ],
      "family": "yellow",
      "temperature": "warm",
      "tone": [
        "muted",
        "earth-tone"
      ],
      "luminance": 0.4075,
      "contrast": {
        "black": 9.15,
        "white": 2.3
      },
      "wcag": {
        "AA": [
          "#000000",
          "#1A1A1A"
        ],
        "AAA": [
          "#000000",
          "#1A1A1A"
        ]
      },
      "bestText": {
        "text": "#000000",
        "label": "black text",
        "ratio": 9.15
      },
      "description": "Sage Gray is #B2AC88, a warm yellow color with muted and earth tone character. Compared with Greige, it is lighter and more saturated. Use it for natural palettes, wellness branding, and sustainability design, with black text as the safer foreground option.",
      "url": "https://www.colorsencyclopedia.com/colors/sage-gray/",
      "apiUrl": "https://www.colorsencyclopedia.com/api/colors/sage-gray.json"
    },
    {
      "slug": "greige",
      "name": "Greige",
      "hex": "#B0A999",
      "rgb": [
        176,
        169,
        153
      ],
      "hsl": [
        42,
        13,
        65
      ],
      "cmyk": [
        0,
        4,
        13,
        31
      ],
      "family": "orange",
      "temperature": "warm",
      "tone": [
        "muted",
        "earth-tone"
      ],
      "luminance": 0.3991,
      "contrast": {
        "black": 8.98,
        "white": 2.34
      },
      "wcag": {
        "AA": [
          "#000000",
          "#1A1A1A"
        ],
        "AAA": [
          "#000000",
          "#1A1A1A"
        ]
      },
      "bestText": {
        "text": "#000000",
        "label": "black text",
        "ratio": 8.98
      },
      "description": "Greige is #B0A999, a warm orange color with muted and earth tone character. Compared with Sage Gray, it is darker and less saturated. Use it for backgrounds, typography, and product surfaces, with black text as the safer foreground option.",
      "url": "https://www.colorsencyclopedia.com/colors/greige/",
      "apiUrl": "https://www.colorsencyclopedia.com/api/colors/greige.json"
    }
  ],
  "differences": {
    "rgbDistance": 17.4,
    "contrastRatio": 1.02,
    "hslDelta": {
      "hue": 9,
      "saturation": 8,
      "lightness": 3
    },
    "luminanceDelta": 0.0084,
    "sameFamily": false,
    "sameTemperature": true,
    "sharedTones": [
      "muted",
      "earth-tone"
    ],
    "lighterColor": "Sage Gray",
    "moreSaturatedColor": "Sage Gray"
  },
  "accessibility": {
    "pairContrastRatio": 1.02,
    "textRecommendation": "Do not use this pair for text; use it for neighboring palette colors, decoration, or low-emphasis surfaces.",
    "safeText": [
      {
        "color": "Sage Gray",
        "background": "#B2AC88",
        "foreground": "#000000",
        "label": "black text",
        "ratio": 9.15
      },
      {
        "color": "Greige",
        "background": "#B0A999",
        "foreground": "#000000",
        "label": "black text",
        "ratio": 8.98
      }
    ]
  },
  "useCases": {
    "chooseFirstWhen": "Sage Gray is better when the design needs muted and earth tone yellow character, warm temperature, and the specific HEX value #B2AC88.",
    "chooseSecondWhen": "Greige is better when the design needs muted and earth tone orange character, warm temperature, and the specific HEX value #B0A999.",
    "useTogetherWhen": "Use these colors together as related palette neighbors, subtle material differences, or tonal alternatives rather than readable foreground/background pairs."
  },
  "relatedApi": [
    "https://www.colorsencyclopedia.com/api/compare/sage-gray-vs-greige.json",
    "https://www.colorsencyclopedia.com/api/colors/sage-gray.json",
    "https://www.colorsencyclopedia.com/api/colors/greige.json"
  ],
  "url": "https://www.colorsencyclopedia.com/compare/sage-gray-vs-greige/",
  "apiUrl": "https://www.colorsencyclopedia.com/api/compare/sage-gray-vs-greige.json"
}