VBC-029: glassmorphism-overuse

warning

Category: ux-dx
Analysis: Regex (line by line)
File types: .css, .scss, .less
Scope: source code only, ignoring anything inside strings and comments
Tags: ux performance

What it reports

backdrop-filter:blur() (glassmorphism) at line {line}. This effect forces GPU compositing on every frame, severely impacting performance on low-end and mobile devices. It also frequently reduces text contrast below accessibility thresholds. Use sparingly and test on real hardware.

Flagged

.card { backdrop-filter: blur(12px); }

Not flagged

.card { background: var(--surface); }

Pattern

backdrop-filter:\s*blur\(