---
sourceDocument: Australia ServiceNow AI Platform user interface
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/platform-user-interface

 Release :

    - australia

ft:locale :

    - en-US

ft:publication_title :

    - Australia ServiceNow AI Platform user interface

ft:clusterId :

    - platux

bundleId :

    - platux

workflow :

    - Platform


---

# Include font icons as a widget dependency

# Include font icons as a widget dependency {#ariaid-title1}

* Release version: Australia
* 
* Updated March 12, 2026
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 1 minute to read

You can include font icons wherever a widget is loaded by including them as a widget
dependency.

## Before you begin

Role required: admin or sp_admin

## About this task

Note:  
CSS included as a widget dependency is not scoped and can disrupt other CSS on a page.

## Procedure

1. In the platform UI, navigate to Service PortalCSS and create a new style sheet.
2. Attach the font-icon set to the sp_css record you created, and use the sys_id of the attachment as the `src` for the font icon.  
   For example:

       @font-face {
         font-family: 'Material Icons';
         font-style: normal;
         font-weight: 400;
         src: url('/828b8ca8b7033010897725cbde11a9f7.iix') format('woff2');
       }

       .material-icons {
         font-family: 'Material Icons';
         font-weight: normal;
         font-style: normal;
         font-size: 24px;  /* Preferred icon size */
         display: inline-block;
         line-height: 1;
         text-transform: none;
         letter-spacing: normal;
         word-wrap: normal;
         white-space: nowrap;
         direction: ltr;

         /* Support for all WebKit browsers. */
         -webkit-font-smoothing: antialiased;
         /* Support for Safari and Chrome. */
         text-rendering: optimizeLegibility;

         /* Support for Firefox. */
         -moz-osx-font-smoothing: grayscale;

         /* Support for IE. */
         font-feature-settings: 'liga';
       }

3. Navigate to Service PortalDependencies and create a new dependency.
4. Attach the CSS record you created to the new dependency using the CSS Includes related list.
{#font-icons-dependency__ol_rj3_vxv_qy}

*[\>]: and then