Interface: BackgroundProps

Table of contents

Properties

• color
• gap
• id
• lineWidth
• offset
• size
• variant
• x
• y

Properties

color

• Optional color: string

The background pattern color

This only changes the color of the pattern, not the background color itself.

If you want to change the background color itself, you can apply a bg-color to the <VueFlow> element instead

---

gap

• Optional gap: number | number[]

The background pattern gap

Can be either a number or [xGap: number, yGap: number], defining the gap on the X and Y axis respectively

Default

20

---

id

• Optional id: string

<Background> component id

This is necessary when you have multiple flows with backgrounds visible at the same time. If no id is explicitly assigned, an auto-generated one is used.

Default

pattern-${vueFlowId}${id ? -${id} : ''}

---

lineWidth

• Optional lineWidth: number

Default

1

---

offset

• Optional offset: number

Background pattern offset

Default

2

---

size

• Optional size: number

Background pattern size

Default

1

---

variant

• Optional variant: BackgroundVariant

The background pattern variant BackgroundVariant

Default

'dots'

---

x

• Optional x: number

Background x-coordinate (offset x)

Default

0

---

y

• Optional y: number

Background y-coordinate (offset y)

Default

0