Liquid Chrome

Liquid metallic chrome shader with flowing reflective surface.

Default

Speed, amplitude, base color and interaction are wired to the controls underneath. Move the pointer over the chrome and it ripples around the cursor.

Demo Content

FeaturesAbout Sign up

New Creative Components

Get started Learn more

Base Color

Speed0.3

Amplitude0.3

Enable Interaction

Prop	Type	Default	Description
`baseColor`	`number[3]`	`[0.1, 0.1, 0.1]`	Base color of the component. Specify as an RGB array.
`speed`	`number`	`0.2`	Animation speed multiplier.
`amplitude`	`number`	`0.3`	Amplitude of the distortion.
`frequencyX`	`number`	`3`	Frequency modifier for the x distortion.
`frequencyY`	`number`	`3`	Frequency modifier for the y distortion.
`interactive`	`boolean`	`true`	Enable mouse/touch interaction.

Keyboard shortcuts and ARIA behavior.

Purely decorative canvas. Set speed low or interactive off for users who prefer reduced motion.