API
Watermarks
Watermarks
Text watermark
import type { WatermarkOptions } from 'vue-pdf-export'
const watermark: WatermarkOptions = {
enabled: true,
layer: 'background',
type: 'text',
mode: 'repeat',
text: 'CONFIDENTIAL',
opacity: 0.1,
rotation: -35,
fontSize: 36,
gapX: 100,
gapY: 90,
}
<Html2Pdf :watermark="watermark" />
Foreground watermark
const watermark = {
enabled: true,
layer: 'foreground',
type: 'text',
mode: 'single',
text: 'DRAFT',
opacity: 0.15,
rotation: -30,
fontSize: 60,
x: 0.5,
y: 0.5,
}
Foreground watermarks are drawn onto final PDF pages with jsPDF.
Image watermark
const watermark = {
enabled: true,
layer: 'foreground',
type: 'image',
mode: 'single',
imageUrl: '/logo.png',
opacity: 0.1,
rotation: -25,
width: 180,
x: 0.5,
y: 0.5,
}
A data URL can also be used:
const watermark = {
enabled: true,
type: 'image',
imageDataUrl: 'data:image/png;base64,...',
}
imageDataUrl takes priority over imageUrl.
Per-page watermark targeting
const watermark = {
enabled: true,
type: 'text',
text: 'INTERNAL',
pages: 'except-first',
}
Explicit pages:
const watermark = {
enabled: true,
text: 'INTERNAL',
pages: [1, 3, 5],
}
Supported targets:
all
first
last
except-first
number[]
For selective targeting, a requested background watermark may be applied during final PDF post-processing so selected-page behavior can be preserved.
Watermark options
| Option | Type | Description |
|---|---|---|
enabled | boolean | Enable/disable watermark. |
type | `'text' \ | 'image'` |
layer | `'background' \ | 'foreground'` |
mode | `'single' \ | 'repeat'` |
text | string | Text content. |
fontSize | number | Text size. |
fontFamily | string | Font family. |
fontWeight | `string \ | number` |
fontStyle | `'normal' \ | 'bold' \ |
color | string | Watermark color. |
imageUrl | string | Image URL. |
imageDataUrl | string | Data URL/base64 image. |
width | number | Image width. |
height | number | Optional image height. |
opacity | number | Clamped to 0..1. |
rotation | number | Rotation in degrees. |
x | number | Horizontal position. |
y | number | Vertical position. |
gapX | number | Horizontal repeat gap. |
gapY | number | Vertical repeat gap. |
pages | PdfPageTarget | Target pages. |