PDFMake.js Example to Add Colorful Text Watermark at Different Font Size or Angles to PDF Document in Browser Using Javascript Full Project For Beginners





  • text – watermark text
  • color – color of text
  • opacity opacity of text
  • bold – bold style of text
  • italics – italics style of text
  • fontSize – own font size of text (ideal size is calculated automatically) (minimal version: 0.1.60)
  • angle – angle of text rotation (minimal version: 0.1.60)






<!DOCTYPE html>
<html lang="en">

  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">


<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.70/pdfmake.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.70/vfs_fonts.js"></script>
  // playground requires you to assign document definition to a variable called dd

  var docDefinition = {
    watermark: { text: 'test watermark', color: 'blue', opacity: 0.3, bold: true, italics: false },

  content: [
    'paragraph 1',
    'paragraph 2',
      columns: [
        'first column is a simple text',
          // second column consists of paragraphs
          'paragraph A',
          'paragraph B',
          'these paragraphs will be rendered one below another inside the column'


Leave a Reply