diff --git a/popup.html b/popup.html
index 31f99be9..1dce64d0 100644
--- a/popup.html
+++ b/popup.html
@@ -101,6 +101,9 @@
     <div class="search-result">
       <a class="search-result-title"><span></span></a>
       <div class="search-result-info">
+        <picture class="search-result-screenshot" i18n-title="installButton">
+          <img class="search-result-screenshot-default">
+        </picture>
         <img class="search-result-screenshot" i18n-title="installButton">
         <div class="search-result-status"></div>
         <div class="search-result-actions">
diff --git a/popup/search.css b/popup/search.css
index bd67d940..54d77f04 100644
--- a/popup/search.css
+++ b/popup/search.css
@@ -68,7 +68,7 @@ body.search-results-shown {
   filter: opacity(.2);
 }
 
-.search-result-screenshot {
+.search-result-screenshot > * {
   height: 140px;
   width: 100%;
   object-fit: cover;
@@ -82,7 +82,7 @@ body.search-results-shown {
   overflow-wrap: break-word;
 }
 
-.search-result-title img {
+.search-result-title picture {
   width: 20px;
   height: 20px;
   margin: -6px 4px -6px 0;
diff --git a/popup/search.js b/popup/search.js
index a474e344..4feb85f1 100644
--- a/popup/search.js
+++ b/popup/search.js
@@ -284,9 +284,23 @@
     $('.search-result-title span', entry).textContent =
       t.breakWord(name.length < 300 ? name : name.slice(0, 300) + '...');
     // screenshot
-    const elShot = $('.search-result-screenshot', entry);
+    const elShot = $('.search-result-screenshot-default', entry);
     if (isUsw) {
-      elShot.src = /^https?:/i.test(shotName) ? shotName : BLANK_PIXEL;
+      if (/^https?:/i.test(shotName)) {
+        elShot.src = shotName;
+        // USw has by default a screenshot of the style in webp format.
+        // But for compatability reasons always deliver the jpg format.
+        // Webp format is more efficient and thus is preffered to be used.
+        // When supported.
+        const webpElShot = $create('source', {
+          type: 'image/webp',
+          srcset: shotName.replace(/\.jpg$/, '.webp'),
+        });
+        const pictureEl = $('.search-result-screenshot', entry);
+        pictureEl.insertBefore(webpElShot, pictureEl.firstChild);
+      } else {
+        elShot.src = BLANK_PIXEL;
+      }
     } else {
       const auto = URLS.uso + `auto_style_screenshots/${id}${USO_AUTO_PIC_SUFFIX}`;
       Object.assign(elShot, {