Watermarkit

Watermarkit directive for Vue2/3.

Get Started

1$ yarn add v-watermarkit

1import { createApp } from 'vue'
2import Watermark from 'v-watermarkit'
3
4const app = createApp({/* ... */})
5
6app.use(Watermark)

Usage

1<template>
2  <div v-watermark="text"></div>
3  <!-- or -->
4  <div
5    v-watermark="{
6      text,
7      color: `#aaa`,
8      fontSize: 16,
9      zIndex: 999,
10      opacity: .3,
11      rotate: 30,
12      gap: 80,
13    }"
14  ></div>
15</template>
16<script setup>
17import { ref } from 'vue'
18
19const text = ref(`大板栗 banli.co`)
20</script>

ScreenShot

Api

props	type	default
text	string	''
color	string	#999
fontSize	number	12
zIndex	number	9999
opacity	number	.1
rotate	number	15
gap	number	50

License

Licensed under the MIT License