Magnifier

Magnifier+ introduces a liquid distortion effect that simulates the optical nature of liquids, revealing stunningly immersive visual forms.

Copy on Framer Market

View on Sandbox

Property Controls

Radius (Number: 0 - 1)

Magnifier radius, the value is the ratio of the canvas's wider side.

Strength(Number: 0 - 1)

Magnifier distortion intensity.

Space (Number: 0 - 1)

Center flatness range.

Disturbance (Number: 0 - 1)

Surface irregular texture intensity.

Advance: Feather (Number: 0 - 1)

Magnifier edge feathering intensity.

Advance: Threshold (Number: 0 - 1)

Feathering starting point.

Advance: Compensation (Number: 0 - 1)

Adjust feathering extension range.

Advance: Dispersion (Number: 0 - 1)

Edge dispersion effect.

Advance: Scale (Number: 0 - 1)

Magnifier content zoom.

Advance: Fade In (Boolean: Yes / No)

Fade-in effect at animation start.

Distortion

Component

Media

Image

Video

Image

Upload

Fit

Radius

Strength

Space

Disturbance

Advance

Animation

Appear

Transition

Spring

Accessibility

Spring

Advance

Feather

Threshold

Compensation

Dispersion

Scale

Fade In

Yes

Animation

Type

Custom

Enable

Yes

Customize the animation target value for each property.

Radius

Strength

Space

Disturbance

Feather

Threshold

Compensation

Dispersion

Scale

Transition

Instant

Ease

Spring

Accessibility

Aria Label

Yes

Compatibility

Yes

Disable effects and use regular image/video elements. e.g. use on Phone layout for better performance.

Reduce Motion

Allow

Block

Whether to allow Reduce Motion to control animation.

Renderer

Auto

Always

Control when the renderer will render.

Magnifier

Distortion

Component

Media

Image

Video

Image

Upload

Fit

Radius

Strength

Space

Disturbance

Advance

Animation

Appear

Transition

Spring

Accessibility

Spring

Advance

Feather

Threshold

Compensation

Dispersion

Scale

Fade In

Yes

Animation

Type

Custom

Enable

Yes

Customize the animation target value for each property.

Radius

Strength

Space

Disturbance

Feather

Threshold

Compensation

Dispersion

Scale

Transition

Instant

Ease

Spring

Accessibility

Aria Label

Yes

Compatibility

Yes

Disable effects and use regular image/video elements. e.g. use on Phone layout for better performance.

Reduce Motion

Allow

Block

Whether to allow Reduce Motion to control animation.

Renderer

Auto

Always

Control when the renderer will render.

Magnifier

Distortion

Component

Media

Image

Video

Image

Upload

Fit

Radius

Strength

Space

Disturbance

Advance

Animation

Appear

Transition

Spring

Accessibility

Spring

Advance

Feather

Threshold

Compensation

Dispersion

Scale

Fade In

Yes

Animation

Type

Custom

Enable

Yes

Customize the animation target value for each property.

Radius

Strength

Space

Disturbance

Feather

Threshold

Compensation

Dispersion

Scale

Transition

Instant

Ease

Spring

Accessibility

Aria Label

Yes

Compatibility

Yes

Disable effects and use regular image/video elements. e.g. use on Phone layout for better performance.

Reduce Motion

Allow

Block

Whether to allow Reduce Motion to control animation.

Renderer

Auto

Always

Control when the renderer will render.

Magnifier

Magnifier+ introduces a liquid distortion effect that simulates the optical nature of liquids, revealing stunningly immersive visual forms.

Copy on Framer Market

Get Start

Learn about the properties, controls, and usages.

Check it out

Troubleshooting

Check out our support page or contact us for solutions.

Support

Sampling

Tsunami

Reveals Cool WebGL Effects Components for Framer - Magnifier

Stay updated.

Subscribe to our newsletter to stay up to date and to receive important updates.

Home

Support

About

Source Code

Effects

CMS

Source Code

Source Code

Source Code