Table of Contents

SharePoint

Column formatting

Column Formatter in SharePoint Online. You can use column formatting to customize how fields in SharePoint lists and libraries are displayed. To do this, you construct a JSON object that describes the elements that are displayed when a field is included in a list view, and the styles to be applied to those elements.

Examples:

PnP GitHub Samples:

approval-buttons-setValue-status-user
color-based-smiley-face
comment-count
currency-symbol-concatenation
custom-hover-card
date-check-blank-format
date-compress-format
date-difference
date-monthly-emoji
date-page-a-day-calendar
date-range-format
date-update-format
file-thumbnail
generic-approval-status-hover-card
generic-calculator
generic-centered-content
generic-column-chart
generic-comment-count
generic-download-file-button
generic-file-preview
generic-filepicker
generic-flow-status
generic-gauge
generic-hourglass
generic-hyperlink-thumbnail
generic-hyperlink-values
generic-icon-overlay
generic-issuestatus-pill
generic-launch-powerapp
generic-like-dislike-bar
generic-like-unlike
generic-likedby
generic-link-to-parent-documentset
generic-mailto-button
generic-one-point-chart
generic-open-file-as-pdf
generic-project-management
generic-right-align
generic-rowactions
generic-rowIndex-drawing
generic-scheduling-link
generic-socialpic
generic-start-flow
generic-start-flow-conditionally
generic-staticmap
generic-substring-status
generic-svgicon-format
generic-time-schedule
generic-timeline
generic-twitterpic
generic-update-button
generic-world-time
generic-yearly-gantt-chart
generic-youtube-thumbnail
hyperlink-click-count
image-lightbox
location-address
location-bing-maps
location-weather
managed-metadata-tag-icon
multi-choice-foreach
multi-choice-icons
multi-choice-links
multi-choice-workcategory-pill
multi-lookup-projected-field
multi-person-currentuser
multi-person-facepile
multi-person-mailto
multi-person-reaction
multi-person-teams-chat-link
multi-person-unique-reaction
number-abs-tolerance-comparison
number-background-color-shading
number-battery
number-circle-in-circle
number-conditional-format
number-conditional-progress-color
number-countup-countdown
number-data-bar
number-data-bar-multi-color
number-decimal-binary
number-doughnut-chart
number-emoji-progressbar
number-gauge
number-gradation
number-heart-in-heart
number-heart-shading
number-icon-progressbar
number-level-bar
number-localization
number-piechart
number-quiz-smiley-face
number-star-rating
number-trending-icon
number-version-publish-status
number-volume
person-currentuser
person-hover-card
person-localization
person-mailto
person-roundimage-format
person-teams-call-format
picture-roundimage-format
promotedstate-demote-news
text-bing-map
text-conditional-format
text-contains
text-course-registration
text-expand-collapse-format
text-isbn-image
text-local-image
text-local-link
text-ryg-status-indicator
text-startswith-callingcodes
text-strikethrough
text-wrap-format
yesno-checkbox
yesno-checkmark
yesno-checkmark-format
yesno-icon-color
yesno-roundedfill-format
yesno-toggle-format

Source: YouTube

SharePoint Articles