diff --git a/doc/developers/index.md b/doc/developers/index.md
index 985b570f..3f6597bd 100644
--- a/doc/developers/index.md
+++ b/doc/developers/index.md
@@ -43,7 +43,11 @@ Browse:
 
 ## Images
 
-The tile images are JPG format and named `1080.jpg`.
+The tile images are JPG format and there are two files:
+
+* `540.jpg` which is for typical use.
+  
+* 1080.jpg` which is for future use because it's the same size as the Instagram tile.
 
 We convert the images to 1080x1080 because this is the size that Instagram uses for social tiles:
 
diff --git a/index.html b/index.html
index 10111ee1..b3a91525 100644
--- a/index.html
+++ b/index.html
@@ -385,10 +385,10 @@ <h1>www.Aberystwyth.info</h1>
                             <div class="pure-u-1 pure-u-md-1-2 pure-u-lg-1-4">
                                 <div class="pure-u-box group-box">
                                     <template x-if="group.handle != null">
-                                        <a :href="groupTileURL(group)"><img class="pure-img" style="border: 1px solid #333;" loading="lazy" :src="'assets/images/icons/' + group.handle + '/1080.jpg'" alt="icon" ></a>
+                                        <a :href="groupTileURL(group)"><img class="pure-img" style="border: 1px solid #333;" loading="lazy" :src="'assets/images/icons/' + group.handle + '/540.jpg'" alt="icon" ></a>
                                     </template>
                                     <template x-if="group.handle == null">
-                                        <img class="pure-img" style="border: 1px solid #333;" loading="lazy" :src="'assets/images/icons/x/1080.jpg'" alt="icon" >
+                                        <img class="pure-img" style="border: 1px solid #333;" loading="lazy" :src="'assets/images/icons/x/540.jpg'" alt="icon" >
                                     </template>
                                     <h2>
                                         <template x-if="group.title_as_en != null">