diff --git a/src/components/HeroSection.js b/src/components/HeroSection.js
index da698fe..bf80128 100644
--- a/src/components/HeroSection.js
+++ b/src/components/HeroSection.js
@@ -245,18 +245,25 @@ export default function HeroSection(props) {
       let [uriURL, uriProtocol] = await getURLFromURI(tokenURI);
 
       let uriResponse;
-      try {
-        uriResponse = await fetch(uriURL, { method: "GET" });
-      } catch (e) {
-        console.error(e);
-        setFetchError(createMainError(nftAddress));
-        // setFetchError("Could not fetch NFT URI " + tokenURI);
-        setIsLoading(false);
-        return;
-      }
+      let imgURI;
 
-      let uriInfo = await uriResponse.json();
-      let imgURI = uriInfo.image;
+      if (uriProtocol !== "On-chain") {
+        try {
+          uriResponse = await fetch(uriURL, { method: "GET" });
+        } catch (e) {
+          console.error(e);
+          setFetchError(createMainError(nftAddress));
+          // setFetchError("Could not fetch NFT URI " + tokenURI);
+          setIsLoading(false);
+          return;
+        }
+
+        let uriInfo = await uriResponse.json();
+        imgURI = uriInfo.image;
+      } else {
+        // On-chain metadata can pass the image uri directly
+        imgURI = uriURL;
+      }
 
       let [imageURIURL, protocol] = await getURLFromURI(imgURI);
 
@@ -311,12 +318,13 @@ export default function HeroSection(props) {
 
       let severity = "undefined";
       switch (uriProtocol) {
-        case "ipfs":
-          severity = "medium";
-          break;
+        case "On-chain":
         case "arweave":
           severity = "strong";
           break;
+        case "ipfs":
+          severity = "medium";
+          break;
         case "centralized":
           severity = "poor";
           break;
diff --git a/src/utils.js b/src/utils.js
index 0935b64..04df1db 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -5,6 +5,7 @@ export const arweaveEndpoint = "https://arweave.net";
 
 const CID = require("cids");
 const arweave = Arweave.init();
+const BASE64_JSON_HEADER = "data:application/json;base64,";
 
 export const buildQuery = (ipfsHash) => `
 query {
@@ -72,6 +73,16 @@ export const getURLFromURI = async (uri) => {
     if (!uri) {
       return ["", "undefined"];
     }
+
+    if (uri.indexOf(BASE64_JSON_HEADER) === 0) {
+      debugger;
+      var base64Data = uri.replace(BASE64_JSON_HEADER, "");
+      var jsonData = JSON.parse(atob(base64Data));
+      var imageData = await getURLFromURI(jsonData.image);
+      imageData[1] = "On-chain";
+      return imageData;
+    }
+
     // if correct URI we get the protocol
     let url = new URL(uri);
     // if protocol other IPFS -- get the ipfs hash
@@ -79,6 +90,7 @@ export const getURLFromURI = async (uri) => {
       // ipfs://ipfs/Qm
 
       let ipfsHash = url.href.replace("ipfs://ipfs/", "");
+      ipfsHash = ipfsHash.replace("ipfs://", "");
 
       return [ipfsGetEndpoint + ipfsHash, "ipfs"];
     }