I have a web part that displays documents and the icon based on their extension (for example Word document displays Word logo based on .docx). I am building a url to display the image

extension = "docx"
var iconLocation = hostUrl + "/_layouts/15/image/ic" + extension + ".png";

I have found through researching this topic that txt extensions need to end with .gif instead of .png. Is there a way to know for sure which icons are supported? I ran into an issue where displaying .png files didn't show a valid image but I am unable to find some sort of documentation that would tell me which files will be handled and how (.png or .gif ending, possible others?)

  • Where are you trying to find the icon for a document? The list item has a property which gives you an icon for each file. – Venkat Konjeti Jun 8 '17 at 16:57
  • It has not been uploaded to the list at that point – cooper Jun 8 '17 at 17:39

Below are the list icons for different files. This has been extracted from On-Premises server. But these are being used same for SharePoint online site also.

You can see a list of your file extensions and support icon images with extension.

enter image description here enter image description here


This is the code I use

function getIconUrl(extension, isLarge){

    var filename;

    extension = extension.toLowerCase();

        case 'pptx':
        case 'ppt':
        case 'docx':
        case 'doc':
        case 'xlsx':
        case 'xls':
        case 'pdf':

        case 'html':
        case 'htm':

        case 'zip':
        case 'aspx':
        case 'asp':



    return '/_layouts/images/'+((isLarge) ? "lg_" : "")+filename;

I guess we don't have txt files, but this should help you work it out.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.