Custom font in Visualforce Page

| By Webner

We can use custom fonts in the Visualforce page using Salesforce Static Resources. Following are the steps to use custom fonts:

  1. In Setup, use the Quick Find box to find Static Resources and create new a resource with ZIP of the font file as given below:
  2. Create a css file micrStyle.css with the following code:
    @font-face {
    font-family: "micr";
    src: url('{!URLFOR($Resource.micr, 'micr.ttf')}') format('truetype');
    body {
    font-family: micr;
  3. Create a resource for micrStyle.css as given below:
  4. Use the above CSS static resource in your VF page code as given below:
    <!-- Static Resources for CSS -->
    <apex:styleSheet value="{!URLFOR($Resource.micrStyle,micrStyle.css')}"/>

Leave a Reply

Your email address will not be published. Required fields are marked *