---
title: "Troubleshooting Liquid Glass Fallback"
description: "Why Essence Ghost theme shows Glass instead of Liquid cards in Firefox and Safari, how it detects Chromium, and what to check if Chrome shows Glass."
url: "https://www.priority.vision/docs/essence/troubleshooting-liquid-glass-fallback"
scope: theme
appliesTo: [Essence]
lastUpdated: 2026-10-01
---

# Liquid Glass Fallback

Essence's **Liquid** card style uses an SVG-based refraction filter (`backdrop-filter: url(...)`). This API is only available in Chromium-based browsers.

## Browser support

| Browser | Liquid glass |
|---------|--------------|
| Chrome (desktop & Android) | ✅ Full effect |
| Edge | ✅ Full effect |
| Firefox | ❌ Falls back to Glass |
| Safari (macOS & iOS) | ❌ Falls back to Glass |
| Other non-Chromium | ❌ Falls back to Glass |

## What visitors see in unsupported browsers

When liquid glass cannot initialize, Essence:

1. Skips the liquid-glass JavaScript module
2. Keeps the standard **Glass** backdrop-blur layer visible
3. Preserves card layout, blur, shading, and edge settings

The fallback is automatic — no visitor action or theme setting required.

    **Glass** is not a bug — it is the designed fallback. Cards still look frosted and readable; only the refractive liquid effect is missing.

## How detection works

On page load, Essence checks:

1. Chromium user agent and vendor (`Chrome`, `Edge`, `CriOS`)
2. SVG `backdrop-filter: url()` support via a capability probe

If either check fails, liquid glass is not loaded.

## Settings affected

Liquid glass applies only when these settings are **Liquid**:

- **Posts list card style**
- **Post page card style**

Each can be set independently. You might use **Liquid** on the homepage post list and **Solid** on post pages for readability.

## Recommendations

### For publishers

- Preview liquid glass in **Chrome** before launch
- Do not worry about Firefox/Safari visitors — fallback is seamless
- If you need identical visuals everywhere, use **Glass** instead of **Liquid**

### For developers

Liquid glass loads as a separate JavaScript chunk (`@essence/effects/liquid-glass`). It initializes only when a `.section-posts-card-style-liquid` or `.post-container-card-style-liquid` scope exists on the page.

## Chrome but still seeing Glass?

If you use Chrome and still see glass instead of liquid:

1. Hard-refresh the page (cache may serve an older bundle)
2. Check for extensions that block canvas or filter effects
3. Confirm the card style setting is **Liquid**, not **Glass**
4. Open DevTools console for JavaScript errors

## Documentation Index
> Fetch the complete documentation index at: https://www.priority.vision/docs/essence/llms.txt
> Use this file to discover all available pages before exploring further.