A little bit of History ?

With the advent of the new user experience of SharePoint which called Modern Experience, it's more than a cool and fresh look, it's designed from the ground up to work on mobile devices. And now, lists and libraries have a new look, checkout the difference between a classic document library next to a modern one:Image result for classic document library vs modern

The modern page is definitely easier to use, and allows more advanced filtering and customisation.
So at the beginning of 2018, Microsoft launched a feature for columns within modern SharePoint lists and libraries. This feature called SharePoint Column Formatting

So what is this feature?

This feature is launched in order to highlight key business data in your different column types, it include icons, colours, fonts, images and data bars. these could be displayed based upon a condition. For example if you have a Ticketing System implemented in your SharePoint Tenant, and you have a list of Tickets then you can customise your Status column by applying the following rules: (If the status is Active then set a blue colour, If the status is In progress then set a yellow colour, If it is Resolved then set a green colour.) simple isn't ? checkout the following picture i found it in the Internet, fabulous right ? just imagine the impact of this simple feature for the end-users, they will be the happiest users in the earth 😂
Image result for sharepoint column formatting status

How can you use it?

First of all you need to open your Column Formatting pane, please follow the next steps: 
  • Go to your column that you want to customize
  • Open the drop-down menu under that column
  • Click on Column Settings
  • Select Format this column
The following pane will appear to you:

screenshot of the sample

Now there is two different mode, the first one which is the normal mode dedicated for the end-users where they can edit the display by simple clicks. The second mode is the advanced mode, where you paste your JSON code following a defined schema.

you can Preview the formatting or you can directly commit your changes by selecting Save.

Additional notes

This sample is also covered in the main documentation around the Column Formatting and the in the official repository of SharePoint: