Show Description on Modern SharePoint Document Libraries

Build an application extension as per the tutorial Build your first SharePoint Framework Extension

Install sp-pnpjs and include this import line

import pnp from "sp-pnp-js";

Replace the class content as follows

/** A Custom Action which can be run during execution of a Client Side Application */
export default class ListPropertiesApplicationCustomizer
  extends BaseApplicationCustomizer {
  public onInit(): Promise {
    return Promise.resolve();
  public getList(): Promise {
    //get the ID of the list from the page context
    const listId: Guid =;
      pnp.sp.web.lists.getById(listId.toString()).get().then(r => {
        // the list object properties are all returned as per the object model
        //Find the list title element using native typescript 
        var parent = document.getElementsByClassName("StandaloneList-title");
        //create a new div
        var newDiv = document.createElement('div');
        //style the new div as you wish
        newDiv.setAttribute("style", "color:red; border-bottom: 1px solid blue; font-size:14px; ");
        // add the decription content
        newDiv.textContent = r.Description;
        //append to the document under the list title
    return Promise.resolve();

The styling and the placement is up to you.