El Vaso

Liquid Glass Effect for React

Glass Attributes

Depth0.4
0
Blur0.3
0
Radius12.0
0
Dispersion0.3
0

Play

Quick start to draw a glass:
import { Vaso } from 'vaso'
Vaso was blessed by the SVG filter and became a powerful glass.

Drag the glass around

Depth
0
Frosted

Installation

npm install vaso

Usage

Import the <Vaso> component in your React application and wrap it around any content you want to apply the glass effect to.

Vaso provides intuitive props to control every aspect of the liquid glass effect. Use depth to control distortion intensity, blur for backdrop filtering, dispersion for chromatic aberration effects, and radius for rounded corners.

Add spacing with px and py for padding, or enable draggable to make the glass element interactive and moveable by users.

huozhi0XGitHub