Ripple

Ripple

Blocks

Blocks

Reeded Glass

Reeded Glass

Shutters

Shutters

Pixel Scan

Pixel Scan

Distortion

Distortion

Burn

Burn

Error

Error

Crack

Crack

Scan

Scan

Ripple

Ripple

Blocks

Blocks

Reeded Glass

Reeded Glass

Shutters

Shutters

Pixel Scan

Pixel Scan

Distortion

Distortion

Burn

Burn

Error

Error

Crack

Crack

Scan

Scan

Burn

Burn Icon
Burn Icon
Burn Icon

Burn 为你的作品带来独特的视觉变换。它通过模拟画面的燃烧效果,创造出令人惊叹的揭示过程。观众将能够看到燃烧的边缘逐渐蔓延,揭示出作品的真实内容。Burn 允许你为燃烧边缘添加颜色,从而打造不同的表现风格,既能传达转变、重生或真相显露等深层含义,又能创造科技、迷幻、神秘等主题。

Copy Component

属性控制

Mode (Enum: Classic/Spatial)

燃烧效果的配置方式。Classic 模式下提供了透明的画面遮罩,能够显示出其他图层的内容。Spatial模式下能够控制遮罩的颜色,并为媒体内容提供扭曲效果。

Burn (Number: 0-1)

燃烧的进度,当值为1时媒体完全不可见。

Density (Number: 0-2)

燃烧密度,越大的值产生更多的燃烧节点。

Edge Color (Color)

燃烧边缘的颜色,不支持修改透明度。

Mask Color (Color)

遮罩的颜色,不支持修改透明度。仅在 Mode 为 Spatial 时可用。

Invert (Boolean: Yes/No)

反转显示方式,启用时,媒体将会被燃烧而消失。仅在 Mode 为 Spatial 时可用。

Distortion (Number: 0-1)

媒体内容的扭曲强度。仅在 Mode 为 Spatial 时可用。

将组件作为巢内组件时,可以使用以下属性。

Animation Start (EventHandler: onAnimationStart)

当动画开始时触发事件。

Animation End (EventHandler: onAnimationEnd)

当动画结束时触发事件。

Video End (EventHandler: onVideoEnd)

当视频播放结束时触发事件,当 Loop 为 Yes 时,这个事件不会被触发。

Media Loaded (EventHandler: onMediaload)

当媒体载入完成时触发事件。

Burn
Component
Media

Image

Video

Image

Image

Size

Fill

Mode

Classic

Spatial

Burn
Density
Invert

Yes

No

Edge Color

#FFFFFF

Mask Color

#000000

Distortion
Animate

Appear

Transition

Spring

Variant 1

Variant 2

Burn
Component
Media

Image

Video

Image

Image

Size

Fill

Mode

Classic

Spatial

Burn
Density
Invert

Yes

No

Edge Color

#FFFFFF

Mask Color

#000000

Distortion
Animate

Appear

Transition

Spring

Variant 1

Variant 2

Burn
Component
Media

Image

Video

Image

Image

Size

Fill

Mode

Classic

Spatial

Burn
Density
Invert

Yes

No

Edge Color

#FFFFFF

Mask Color

#000000

Distortion
Animate

Appear

Transition

Spring

Variant 1

Variant 2

特性

随心使用你的图片或视频

使用滚动动画来触发效果

使用滚动变换创建交互式体验

使用滚动变换创建交互式体验。

跟随颜色主题切换媒体

兼容 Framer 的过渡控制器

在任意进度停止动画

下一个

Variant 1

Variant 2

Video

by

SHVETS

Variant 1

Variant 2

Video

by

SHVETS

Reveals cool WebGL Effects Components for Framer.