Skip to content

Custom CSS

To customize the styling of the content or for hiding elements in Print/PDF, you can use custom CSS

Sample Customizations

Note

Scope your CSS roles to #printfriendly and add !important to override the default styles

Customizing the margin of Print/PDF

@media print {
  @page {
    margin: 5mm !important;
  }
}

Hide URL

#printfriendly #pf-src {
  display: none !important;
}

Hide Title

#printfriendly #pf-title {
  display: none !important;
}

Use Google Fonts

/* Use the Inter Font */
@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');

#printfriendly {
  font-family: 'Inter', sans-serif !important;
}

Print/PDF in Landscape

@media print {
  @page {
    size: landscape !important;
  }
}