@liquid-canvas/core

iOS Liquid Glass effects for the web — framework-agnostic, plugin-based, three-tier progressive enhancement.

Features

• Three-tier fallback: Native → HTML2Canvas (WebGL) → CSS (backdrop-filter + SVG)
• Plugin system for custom GLSL shader effects
• Built-in effects: liquid-glass (full iOS style) and frosted-glass
• Mouse tracking, chromatic aberration, edge refraction, and more

Install

npm install @liquid-canvas/core

Quick Start

import { glass } from "@liquid-canvas/core"

const instance = await glass("#panel", {
  effect: "liquid-glass",
  options: { refraction: 0.6, blur: 0.3 },
})

// Clean up
instance.dispose()

📖 Documentation  |  📦 GitHub  |  🐛 Issues