Liquid Glass for the web: the rim refraction, light and motion of iOS 27 glass on any rounded element. React bindings and pill tabs. MIT.
| 1 | # @colineapp/liquid-glass |
| 2 | |
| 3 | > Liquid Glass for the web: the rim refraction, light and motion of iOS 27's glass on any rounded element, with React bindings, menus that pour out of their button, and segmented tabs whose thumb clears into a lens. MIT. |
| 4 | |
| 5 | Version 0.2.0. Install: `npm install @colineapp/liquid-glass` |
| 6 |
| 7 | ## A search field that swells |
| 8 |
| 9 | interactive lights it under the pointer, swells it on press and leans it after a drag. |
| 10 |
| 11 | ```tsx |
| 12 | <label className="relative flex h-11 items-center gap-2 rounded-full px-4"> |
| 13 | <LiquidGlass appearance="class" interactive /> |
| 14 | <SearchIcon /> |
| 15 | <input className="bg-transparent outline-none" placeholder="Search" /> |
| 16 | </label> |
| 17 | ``` |
| 18 |