Icon Tips

Standard Icons are from the SLDS Icons gallery and they are entered using the icon name. SLDS Icons can show the Icon with the image, or show some static text on top of the Icon.

Just about any other icon can be used by using the Image field option.

Icons via URL

  • Salesforce Icons and Logos for more icons and logos that you can use - enter Logo URL in the Image field
  • There are a number of built-in icons, and the classic Sample Icons for Flag Green, Flag Red etc. See this website for a list of them all, (but this website doesn’t show you the images) or this website (fewer, but the images are visible) or this website, but many are ugly Classic style icons
  • Grab the URL of the Logo from your company’s website and use that
  • Graphics Pack Salesforce Labs App however the icons don’t look so great when on the SLDS colored background.

Icon Sites

There are many third party icon sites. You can usually download these icons as PNGs or SVGs. Most of these icons, if they are allowed to be used for commercial use require Attribution, so be sure to follow their attribution guidelines, or pay for the icons you want to use.

When viewing an Icon in Icons8, you can click Download, and choose the Link (CDN) option. Choose 96x96 for a Large Indicators Bundle. In the “Paste this fragment into your HTML” box, just copy the URL and paste that into the Image field. This option is good because you can color the icons to the color you want.

Da Button Factory also allows you to copy a URL.

External Icons

Using icons directly linked from external sites, even Salesforce may break or cause slowness in your Salesforce. Use with caution! If in doubt download the icon as an SVG and create it as a Static Resource or PNG as a document.

SVG Downloads

You can do SVG downloads from most icon sites. Streamline and Icons8 allows you to download SVGs with color (see attribution).

To use and SVG file, download the SVG from the Icon site, then create a Static Resource In Salesforce Setup, upload the SVG file and name it YourIconSVG or similar. Then click View File and grab the URL after /resource/ eg /resource/1668327958000/MyIconSVG and paste that into the image field.

Remember to deploy the Static Resources when deploying the CMDT from Sandbox to Prod.

PNG Downloads

You can use PNG Downloads similar to SVG, or use Documents (switch to Classic first), and upload the images into a new folder named Icons (or similar).

Salesforce Files

We do not recommend using Salesforce Files as it is 3 extra steps to get the URL of the icon to use.

Attribution

Please check the website you get the icons from for what attribution is required. See Flaticon Icons8, Streamline, Font Awesome, and The Noun Project attribution requirements. Eg stick a rich text on the home page of your Salesforce in small font.

Most of these sites will not require attribution if you pay for the premium icons.

Back to top

For any help or comments, please ask a question on our Trailblazer Community group.

Edit this page on GitHub