{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/tile-formatting.schema.json",
  "height": 150,
  "width": 160,
  "formatter": {
    "elmType": "div",
    "customCardProps": {
      "openOnEvent": "hover",
      "directionalHint": "rightCenter",
      "isBeakVisible": true,
      "formatter": {
        "elmType": "div",
        "txtContent": "[$Description]",
        "style": {
          "max-width": "300px",
          "padding": "10px",
          "background-color": "rgba(0,0,0,0.9)",
          "color": "white"
        }
      }
    },
    "style": {
      "width": "160px",
      "height": "150px",
      "margin": "5px",
      "border-radius": "8px",
      "box-shadow": "0 2px 5px rgba(0,0,0,0.15)",
      "position": "relative",
      "cursor": "pointer"
    },
    "children": [
      {
        "elmType": "a",
        "attributes": {
          "href": "[$URL]",
          "target": "=if([$NewTab],'_blank','')"
        },
        "style": {
          "text-decoration": "none",
          "display": "block",
          "width": "100%",
          "height": "100%",
          "color": "inherit"
        },
        "children": [
          {
            "elmType": "span",
            "style": {
              "position": "absolute",
              "top": "5px",
              "right": "5px",
              "color": "white",
              "z-index": "1",
              "font-size": "18px"
            },
            "attributes": {
              "iconName": "[$Icon]"
            }
          },
          {
            "elmType": "img",
            "attributes": {
              "src": "=getThumbnailImage([$Image], '160', '150')"
            },
            "style": {
              "width": "160px",
              "height": "150px",
              "object-fit": "cover",
              "border-radius": "8px"
            }
          }
        ]
      }
    ]
  }
}
