Trend styles that fight legibility
- Forbidden
- Glassmorphism (translucent fill +
backdrop-filter: blur()), neumorphism (soft inset/outset shadows on a matching background), and their successors - Instead
- Opaque
--color-bg-raisedwith a--color-stroke-weakedge. Use translucency only over media, and only when legibility is verified against the worst frame.
What this rule looks like
Why this rule
Both styles make sufficient contrast and clear hierarchy structurally difficult — neumorphism in particular defines every element with shadow alone, which fails at 3:1 almost by construction. Trend styles also age badly: the more of them a product carries, the more precisely it is dated. Minimal styling that foregrounds content lasts longer. Experiment freely — but not where it costs legibility or excludes people. Everywhere is its own failure. A frosted panel over a video is a layering decision; frosted cards, a frosted nav, frosted buttons and glowing glass borders on a flat page are decoration applied to everything, and they solve no layering problem at all.
- Kind
- Rule
- Section
- Things to avoid
- Group
- Generic-AI aesthetic
- Bucket
- mechanical
- Severity
- error
- Detector
backdrop-blur- Since
- v0.1.0