---
title: "liquid-css"
description: "CSS-only refractive chromatic aberration effect that fakes light dispersion through glass edges using layered filters."
canonical: "https://vibing.inc/library/liquid-css-vg-0156"
category: "Backgrounds, Effects & CSS Oddities"
subcategory: "Liquid glass"
license: "MIT"
author: "Brandon Jordan (@electrikmilk)"
source: "https://github.com/electrikmilk/liquid-css"
---

# liquid-css
CSS-only refractive chromatic aberration effect that fakes light dispersion through glass edges using layered filters.
## Facts
- Source: https://github.com/electrikmilk/liquid-css
- Category: Backgrounds, Effects & CSS Oddities / Liquid glass
- Author: Brandon Jordan (@electrikmilk)
- Licence: MIT
- Tags: css, chromatic-aberration, glass, effects
## Why it's a gem
Tiny stylesheet that gets 80 percent of the glass look with no JS or WebGL
---
Listed in The Vibeary: https://vibing.inc/library/liquid-css-vg-0156 · JSON: https://vibing.inc/api/public/library/gems/liquid-css-vg-0156