<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>watermark-js-plus</title>
  <script src="https://www.unpkg.com/watermark-js-plus@1.5.7/dist/ie/index.iife.min.js"></script>
</head>
<body>
  test
  <script>
  var watermark = new WatermarkPlus.Watermark({
    content: 'hello my watermark',
    width: 200,
    height: 200,
    rotate: 22,
    layout: 'grid',
    gridLayoutOptions: {
      rows: 2,
      cols: 2,
      gap: [20, 20],
      matrix: [
        [1, 0],
        [0, 1]
      ]
    },
    advancedStyle: {
      type: 'linear',
      colorStops: [
        {
          offset: 0,
          color: 'red'
        },
        {
          offset: 1,
          color: 'blue'
        }
      ]
    }
  });

  watermark.create();
</script>
</body>
</html>

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.