Skip to content

Effect

ShadowEffect

Shadow effect (inner shadow, outer shadow).

x: number

Shadow offset in the x-axis direction.

y: number

Shadow offset in the y-axis direction.

blur: number

Blur radius of the shadow.

spread?: number

Distance to expand or shrink the shadow.

color: Color

Shadow color.

blendMode?: BlendMode

Blend mode.

visible?: boolean

Whether visible, default is true.

scaleFixed?: 'zoom-in' | false

Whether to keep the original shadow scale when zooming the canvas. 'zoom-in' means it stays fixed only when zooming in (it still scales when zooming out).

box?: boolean

Whether it is a boxShadow (only shows outer shadow), default is false.

ts
interface ShadowEffect {
  x: number
  y: number
  blur: number
  spread?: number
  color: Color
  blendMode?: BlendMode
  visible?: boolean
  box?: boolean // Same as CSS3 boxShadow effect, only shows outer shadow
}

BlurEffect

Blur effect (layer blur, background blur).

blur: number

Blur radius.

visible?: boolean

Whether visible.

ts
interface BlurEffect {
  blur: number
  visible?: boolean
}

Released under the MIT License.