# Watermark

- Human documentation: [https://docs.univer.ai/guides/sheets/features/watermark](https://docs.univer.ai/guides/sheets/features/watermark)

- Agent Markdown: [https://docs.univer.ai/guides/sheets/features/watermark.md](https://docs.univer.ai/guides/sheets/features/watermark.md)

- Requested language: `en-US`

- Content language: `en-US`

- Documentation version: `1.0.0-rc.0`

- Source: [sheets/features/watermark.mdx](https://github.com/dream-num/documentation/blob/dev/content/guides/sheets/features/watermark.mdx)

---

#### Package metadata

```json
{
  "plugins": [
    {
      "client": "@univerjs/watermark",
      "facade": "@univerjs/watermark/facade"
    }
  ],
  "server": false
}
```

Watermark feature aims to provide a flexible and secure watermark solution for spreadsheets. It allows developers to add text or image watermarks to spreadsheets and offers various configuration options to customize the appearance and behavior of the watermark.

> Interactive example: [Open the playground](/playground/sheets/watermark)

## Preset Mode

Watermark does not provide a preset, but it supports mixing with its plugins.

### Installation

#### npm

```bash
npm install @univerjs/watermark
```

#### pnpm

```bash
pnpm add @univerjs/watermark
```

#### yarn

```bash
yarn add @univerjs/watermark
```

#### bun

```bash
bun add @univerjs/watermark
```

### Usage

```typescript
import { UniverWatermarkPlugin } from '@univerjs/watermark' // [!code ++]

import '@univerjs/watermark/facade' // [!code ++]

const { univerAPI } = createUniver({
  // ...
  presets: [
    UniverSheetsCorePreset(),
  ],
  plugins: [
    [UniverWatermarkPlugin, { // [!code ++]
      textWatermarkSettings: { // [!code ++]
        content: 'Hello, Univer!', // [!code ++]
        fontSize: 36, // [!code ++]
      }, // [!code ++]
    }], // [!code ++]
  ],
})
```

## Plugin Mode

### Installation

#### npm

```bash
npm install @univerjs/watermark
```

#### pnpm

```bash
pnpm add @univerjs/watermark
```

#### yarn

```bash
yarn add @univerjs/watermark
```

#### bun

```bash
bun add @univerjs/watermark
```

### Usage

```typescript
import { UniverWatermarkPlugin } from '@univerjs/watermark' // [!code ++]

import '@univerjs/watermark/facade' // [!code ++]

const univer = new Univer({
  // ...
})

univer.registerPlugin(UniverWatermarkPlugin, { // [!code ++]
  textWatermarkSettings: { // [!code ++]
    content: 'Hello, Univer!', // [!code ++]
    fontSize: 36, // [!code ++]
  }, // [!code ++]
}) // [!code ++]
```

### Plugins and Configuration

#### @univerjs/watermark

This plugin provides the core implementation of watermark functionality. It allows developers to add text or image watermarks to applications and offers various configuration options to customize the appearance and behavior of the watermark. It provides the `UniverWatermarkPlugin` plugin.

Reference: [@univerjs/watermark](https://docs.univer.ai/reference/packages/plugins/univerjs/watermark.md)

## Facade API

### Importing

> [!INFO: Plugin mode note]
> Only plugin mode requires manually importing the Facade package. Preset mode already includes the corresponding Facade package, so no extra import is needed.

```typescript
import '@univerjs/watermark/facade'
```

### Set Watermark

```typescript
univerAPI.addWatermark('text', { content: 'hello', repeat: true })
```

### Remove Watermark

```typescript
univerAPI.deleteWatermark()
```