User pictures in People Picker in New Experience – CSP/MSP 24 x 7 Support

To show pictures of users in people picker on SharePoint New Site Experience, please follow the steps below:

1. Go to List settings > Advance Settings > Scroll down to the bottom and select New Experience and click Save.

2. Now go to the list and click on arrow near People picker column > More options > Format this column > Advance Options and paste following script:

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
  "elmType": "div",
  "children": [
    {
      "elmType": "div",
      "style": {
        "width": "50px",
        "height": "50px",
        "overflow": "hidden",
        "border-radius": "50%"
      },
      "children": [
        {
          "elmType": "img",
          "attributes": {
            "src": "='/_layouts/15/userphoto.aspx?size=S&accountname=' + @currentField.email",
            "title": "@currentField.title"
          },
          "style": {
            "position": "relative",
            "top": "50%",
            "left": "50%",
            "width": "100%",
            "height": "auto",
            "margin-left": "-50%",
            "margin-top": "-50%"
          }
        }
      ]
    }
  ]
}

3. Click on Preview to see if it looks right, you can also make adjustment to the above script to change the element type (elmType) division values.

Example:

{
      "elmType": "div",
      "style": {
        "width": "50px", #You can modify this
        "height": "50px", #You can modify this
        "overflow": "hidden", #You can modify this
        "border-radius": "50%" #You can modify this
      },

4. Once you are ok with the results just click Save.

Reference: