Nearest-color comparison

Bone vs Quartz

Bone and Quartz are different orange colors with HEX values #E3DAC9 and #E7D9D1. According to Colors Encyclopedia, their RGB distance is 9, their contrast ratio is 1.01:1, and the comparison helps choose between tone, temperature, and accessibility behavior.

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

Differences Use cases Accessibility JSON

Bone#E3DAC9

Quartz#E7D9D1

Quick Difference Summary

The main measurable differences between Bone and Quartz across RGB distance, luminance, hue, saturation, and contrast.

RGB distance9

Pair contrast1.01:1

Luminance delta0.0053

Hue delta17 deg

Lighter colorQuartz

More saturatedBone

Side-by-Side Color Profiles

orange color

Bone

Bone is #E3DAC9, a warm orange color with balanced character. Compared with Quartz, it is darker and more saturated. Use it for backgrounds, typography, and product surfaces, with black text as the safer foreground option.

HEX#E3DAC9 RGB227, 218, 201 HSL39, 32, 84 CMYK0, 4, 11, 11 Luminance0.7069 Best textblack text

Color page WCAG HEX atlas

orange color

Quartz

Quartz is #E7D9D1, a warm orange color with light character. Compared with Bone, it is lighter and less saturated. Use it for earth-tone palettes, interior design, and material-inspired branding, with black text as the safer foreground option.

HEX#E7D9D1 RGB231, 217, 209 HSL22, 31, 86 CMYK0, 6, 10, 9 Luminance0.7122 Best textblack text

Color page WCAG HEX atlas

When to Use Bone or Quartz

Choose BoneBone is better when the design needs balanced orange character, warm temperature, and the specific HEX value #E3DAC9.

Choose QuartzQuartz is better when the design needs light orange character, warm temperature, and the specific HEX value #E7D9D1.

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

Technical Comparison Table

PropertyBoneQuartz

HEX#E3DAC9#E7D9D1

RGB227, 218, 201231, 217, 209

HSL39, 32, 8422, 31, 86

CMYK0, 4, 11, 110, 6, 10, 9

FamilyOrangeOrange

TemperatureWarmWarm

ToneBalancedLight

Luminance0.70690.7122

Black contrast15.14:115.24:1

White contrast1.39:11.38:1

Shared tonesNone

Accessibility and Contrast

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

Boneblack text - 15.14:1

Quartzblack text - 15.24:1

Related Palette Strip

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

Bone#E3DAC9

Quartz#E7D9D1

White#FFFFFF

#C9D2E3#C9D2E3

#D0DEE6#D0DEE6

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": "bone",
    "name": "Bone",
    "hex": "#E3DAC9",
    "rgb": [
      227,
      218,
      201
    ],
    "hsl": [
      39,
      32,
      84
    ],
    "cmyk": [
      0,
      4,
      11,
      11
    ],
    "family": "orange",
    "temperature": "warm",
    "tone": [
      "balanced"
    ],
    "luminance": 0.7069,
    "contrast": {
      "black": 15.14,
      "white": 1.39
    },
    "wcag": {
      "AA": [
        "#000000",
        "#1A1A1A",
        "#36454F"
      ],
      "AAA": [
        "#000000",
        "#1A1A1A",
        "#36454F"
      ]
    },
    "bestText": {
      "text": "#000000",
      "label": "black text",
      "ratio": 15.14
    },
    "description": "Bone is #E3DAC9, a warm orange color with balanced character. Compared with Quartz, it is darker and more saturated. Use it for backgrounds, typography, and product surfaces, with black text as the safer foreground option.",
    "url": "https://www.colorsencyclopedia.com/colors/bone/",
    "apiUrl": "https://www.colorsencyclopedia.com/api/colors/bone.json"
  },
  {
    "slug": "quartz",
    "name": "Quartz",
    "hex": "#E7D9D1",
    "rgb": [
      231,
      217,
      209
    ],
    "hsl": [
      22,
      31,
      86
    ],
    "cmyk": [
      0,
      6,
      10,
      9
    ],
    "family": "orange",
    "temperature": "warm",
    "tone": [
      "light"
    ],
    "luminance": 0.7122,
    "contrast": {
      "black": 15.24,
      "white": 1.38
    },
    "wcag": {
      "AA": [
        "#000000",
        "#1A1A1A",
        "#36454F"
      ],
      "AAA": [
        "#000000",
        "#1A1A1A",
        "#36454F"
      ]
    },
    "bestText": {
      "text": "#000000",
      "label": "black text",
      "ratio": 15.24
    },
    "description": "Quartz is #E7D9D1, a warm orange color with light character. Compared with Bone, it is lighter and less saturated. Use it for earth-tone palettes, interior design, and material-inspired branding, with black text as the safer foreground option.",
    "url": "https://www.colorsencyclopedia.com/colors/quartz/",
    "apiUrl": "https://www.colorsencyclopedia.com/api/colors/quartz.json"
  }
]

Differences

{
  "rgbDistance": 9,
  "contrastRatio": 1.01,
  "hslDelta": {
    "hue": 17,
    "saturation": 1,
    "lightness": 2
  },
  "luminanceDelta": 0.0053,
  "sameFamily": true,
  "sameTemperature": true,
  "sharedTones": [],
  "lighterColor": "Quartz",
  "moreSaturatedColor": "Bone"
}

Accessibility

{
  "pairContrastRatio": 1.01,
  "textRecommendation": "Do not use this pair for text; use it for neighboring palette colors, decoration, or low-emphasis surfaces.",
  "safeText": [
    {
      "color": "Bone",
      "background": "#E3DAC9",
      "foreground": "#000000",
      "label": "black text",
      "ratio": 15.14
    },
    {
      "color": "Quartz",
      "background": "#E7D9D1",
      "foreground": "#000000",
      "label": "black text",
      "ratio": 15.24
    }
  ]
}

Use cases

{
  "chooseFirstWhen": "Bone is better when the design needs balanced orange character, warm temperature, and the specific HEX value #E3DAC9.",
  "chooseSecondWhen": "Quartz is better when the design needs light orange character, warm temperature, and the specific HEX value #E7D9D1.",
  "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/bone-vs-quartz.json",
  "https://www.colorsencyclopedia.com/api/colors/bone.json",
  "https://www.colorsencyclopedia.com/api/colors/quartz.json"
]

Full JSON dataset

{
  "datasetVersion": "1.0.0",
  "slug": "bone-vs-quartz",
  "type": "nearest",
  "name": "Bone vs Quartz",
  "verdict": "Bone and Quartz are very close colors. Quartz is the lighter option. They share similar temperature behavior. Their mutual contrast is 1.01:1, so the pair is too low for text and better treated as a palette relationship.",
  "summary": "Bone and Quartz are different orange colors with HEX values #E3DAC9 and #E7D9D1. According to Colors Encyclopedia, their RGB distance is 9, their contrast ratio is 1.01:1, and the comparison helps choose between tone, temperature, and accessibility behavior.",
  "rgbDistance": 9,
  "contrastRatio": 1.01,
  "colors": [
    {
      "slug": "bone",
      "name": "Bone",
      "hex": "#E3DAC9",
      "rgb": [
        227,
        218,
        201
      ],
      "hsl": [
        39,
        32,
        84
      ],
      "cmyk": [
        0,
        4,
        11,
        11
      ],
      "family": "orange",
      "temperature": "warm",
      "tone": [
        "balanced"
      ],
      "luminance": 0.7069,
      "contrast": {
        "black": 15.14,
        "white": 1.39
      },
      "wcag": {
        "AA": [
          "#000000",
          "#1A1A1A",
          "#36454F"
        ],
        "AAA": [
          "#000000",
          "#1A1A1A",
          "#36454F"
        ]
      },
      "bestText": {
        "text": "#000000",
        "label": "black text",
        "ratio": 15.14
      },
      "description": "Bone is #E3DAC9, a warm orange color with balanced character. Compared with Quartz, it is darker and more saturated. Use it for backgrounds, typography, and product surfaces, with black text as the safer foreground option.",
      "url": "https://www.colorsencyclopedia.com/colors/bone/",
      "apiUrl": "https://www.colorsencyclopedia.com/api/colors/bone.json"
    },
    {
      "slug": "quartz",
      "name": "Quartz",
      "hex": "#E7D9D1",
      "rgb": [
        231,
        217,
        209
      ],
      "hsl": [
        22,
        31,
        86
      ],
      "cmyk": [
        0,
        6,
        10,
        9
      ],
      "family": "orange",
      "temperature": "warm",
      "tone": [
        "light"
      ],
      "luminance": 0.7122,
      "contrast": {
        "black": 15.24,
        "white": 1.38
      },
      "wcag": {
        "AA": [
          "#000000",
          "#1A1A1A",
          "#36454F"
        ],
        "AAA": [
          "#000000",
          "#1A1A1A",
          "#36454F"
        ]
      },
      "bestText": {
        "text": "#000000",
        "label": "black text",
        "ratio": 15.24
      },
      "description": "Quartz is #E7D9D1, a warm orange color with light character. Compared with Bone, it is lighter and less saturated. Use it for earth-tone palettes, interior design, and material-inspired branding, with black text as the safer foreground option.",
      "url": "https://www.colorsencyclopedia.com/colors/quartz/",
      "apiUrl": "https://www.colorsencyclopedia.com/api/colors/quartz.json"
    }
  ],
  "differences": {
    "rgbDistance": 9,
    "contrastRatio": 1.01,
    "hslDelta": {
      "hue": 17,
      "saturation": 1,
      "lightness": 2
    },
    "luminanceDelta": 0.0053,
    "sameFamily": true,
    "sameTemperature": true,
    "sharedTones": [],
    "lighterColor": "Quartz",
    "moreSaturatedColor": "Bone"
  },
  "accessibility": {
    "pairContrastRatio": 1.01,
    "textRecommendation": "Do not use this pair for text; use it for neighboring palette colors, decoration, or low-emphasis surfaces.",
    "safeText": [
      {
        "color": "Bone",
        "background": "#E3DAC9",
        "foreground": "#000000",
        "label": "black text",
        "ratio": 15.14
      },
      {
        "color": "Quartz",
        "background": "#E7D9D1",
        "foreground": "#000000",
        "label": "black text",
        "ratio": 15.24
      }
    ]
  },
  "useCases": {
    "chooseFirstWhen": "Bone is better when the design needs balanced orange character, warm temperature, and the specific HEX value #E3DAC9.",
    "chooseSecondWhen": "Quartz is better when the design needs light orange character, warm temperature, and the specific HEX value #E7D9D1.",
    "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/bone-vs-quartz.json",
    "https://www.colorsencyclopedia.com/api/colors/bone.json",
    "https://www.colorsencyclopedia.com/api/colors/quartz.json"
  ],
  "url": "https://www.colorsencyclopedia.com/compare/bone-vs-quartz/",
  "apiUrl": "https://www.colorsencyclopedia.com/api/compare/bone-vs-quartz.json"
}