GemViewer › Guides

Why diamonds render black in Shopify's 3D viewer (and how to fix it)

You export a ring from Rhino, Matrix or 3Design, upload the .glb to Shopify, and the metal looks fine — but every diamond is a black hole. This is one of the most common problems jewelry stores hit with 3D product media, and it is not your file's fault.

The cause: CAD exports lose the gem material

Jewelry CAD tools model stones as plain geometry. When they export to glTF/GLB, the gemstone material usually comes through as a dark, metallic placeholder with no transparency — and even when it doesn't, the GLB format simply cannot describe how a faceted stone bends light. Refraction between facets, total internal reflection and dispersion (the "fire") are not part of any standard material. Shopify's built-in model viewer renders what the file says, so stones show up black, gray or milky.

Why tweaking materials doesn't work

Making the stone transparent in a standard viewer produces tinted glass, not a diamond. Real gemstone appearance comes from light entering the stone and bouncing between the actual facets before it exits. Without simulating that, no material setting will look right.

The fix: ray-trace the real facet geometry

GemViewer is a Shopify app built specifically for this. It finds the stones in your existing .glb automatically, repairs common export defects (open stone shells, missing pavilions, inverted normals), and ray-traces light through every facet in real time in the shopper's browser. Diamonds sparkle; sapphires, rubies and emeralds get true body color. The metal keeps the look your file already has.

  1. Install GemViewer from the Shopify App Store (free for your first product).
  2. Drop your .glb on a product in the GemViewer dashboard — this upload path also accepts files Shopify's own 3D upload rejects.
  3. Add the "3D Gem Viewer" section to your product template in the theme editor. Done — shoppers rotate and zoom real sparkle.

Frequently asked questions

Why do my diamonds look black in Shopify's 3D viewer?

Jewelry CAD tools like Rhino, Matrix and 3Design export gemstones without a usable gem material — the stones come through as plain dark placeholder meshes with no transparency or refraction. Shopify's built-in model viewer (and most generic GLB viewers) renders exactly what the file says, so the stones show up black, gray or milky while the metal looks fine.

Can I fix it by changing the export settings in my CAD software?

Usually not. Standard glTF/GLB materials cannot describe how a faceted gemstone really bends light — refraction through facets, total internal reflection and dispersion are not part of the format. Even a perfect export looks like tinted glass at best in a standard viewer.

What actually makes gemstones look real in a browser?

Ray tracing through the actual facet geometry: following light as it enters the stone, bounces between facets and exits. That is what produces genuine sparkle, fire and brilliance. GemViewer does this in real time in WebGL on your product pages, using the geometry already in your .glb file.

Shopify also rejects my .glb upload — is that related?

Often, yes. Shopify's admin runs 3D uploads through a strict media validator that fails on many jeweler CAD exports. GemViewer's dashboard uploads the same file through a path that accepts it, then links it to your product automatically.

How long does the fix take?

A few minutes per store: install GemViewer, drop your .glb on a product in its dashboard, and add the “3D Gem Viewer” section in the theme editor. The first product is free; unlimited products are $49/month.

Fix it now: Install GemViewer on the Shopify App Store — free plan available, set up in minutes.