backdrop-filter 开源项目推荐（58 个）

VII-Cae /hyalite--liquid-glass

Real refraction liquid glass for the web: SDF lens maps + SVG displacement + backdrop-filter. One file, no WebGL.

kubai087 /glasswork

A liquid glass material you can take apart, tune and copy as CSS: a refracting thick rim, wallpaper-adaptive ink and live wallpapers, in a playground.

lucaperullo /simple-liquid-glass

The only zero-dependency liquid glass component with real refraction on iPhone & Safari — not a blur fallback. React 16.8–19 + web-component. ~6.5KB.

nordify /css-liquid-glass

Liquid glass for the web: real refraction of the live page with an SVG displacement filter in CSS backdrop-filter. No WebGL.

moekoelueker /open-glass-ui

The open-source Liquid Glass UI system for React and the web. 40 accessible components, CSS-first glass materials, zero runtime dependencies.

creativoma /liquid-glass

A modern React component with liquid frosted glass effect using TailwindCSS. Perfect for creating elegant interfaces with glassmorphism effect.

kosimst /backdropper

Polyfill for CSS backdrop-filter

LeonardSEO /liquid-glass-react

使用单个 SVG feDisplacementMap 滤镜为 React/Next.js 实现真正的 Apple 风格“液态玻璃”边缘折射——无需 WebGL，无需 canvas，约 5KB

shayann07 /liquidglass

Liquid Glass for every stack: the iOS 26/27 glass for Android, desktop, web, React Native, Flutter and .NET. Refraction, dispersion and touch response measured against iOS recordings.

nguyenduy1412 /react-native-blur

Backdrop blur and frosted glass for React Native and Expo on iOS and Android. Blurs headers, tab bars, cards and popups, and works over expo-video and react-native-video.

ysfemreAlbyrk /Progressive-Acrylic

Advanced layered acrylic glass effects for web elements. Create iOS/Windows-style acrylic blur overlays with multiple customizable layers.

jvreeken /glass-lens-react

React 的 Liquid-glass UI ——适用于任何控制的折射玻璃表面，支持自动按平台渲染路径（背景滤镜+SVG、捕捉画布或 WebGL 视频镜头）。完全没有造型设计。

electrikmilk /liquid-css

Refractive chromatic aberration effects in CSS

mur4i /mri-fivem-liquid-glass

Real liquid glass and game blur for FiveM NUI: blurs and refracts the live GTA V frame behind your HTML, where CSS backdrop-filter cannot see the game.

runvendo /fluidkit

Make your product wavy — liquid glass UI animations for React

devshaheerx /digital-clock-app

A responsive digital clock with live time, AM/PM indicator, and date — built with HTML, CSS & Vanilla JS, featuring a frosted glass UI over a full-screen background image.

JohnDeved /hic-liquid-glass

Liquid-glass UI components built on the new HTML-in-Canvas (HIC) browser API.

sohumsuthar /liquid-glass

Liquid Glass for the web, calibrated against macOS 26 Control Center rather than eyeballed — measured transfer curve, ray-traced SVG refraction, measured specular rim. React + CSS.

cameronrye /frostpane

A customizable, modern CSS/SCSS library for creating beautiful frosted glass effects with backdrop blur, highlights, and smooth animations

EdwinHu-OvO /FineProgressiveBlur

基于多层叠加算法的 React 渐变模糊组件。Fine progressive blur component with layered Gaussian blur algorithm