diff --git a/src/General/Build.coffee b/src/General/Build.coffee
index 13d897a69..972a4008e 100644
--- a/src/General/Build.coffee
+++ b/src/General/Build.coffee
@@ -194,6 +194,7 @@ Build =
 
   catalogThread: (thread, data, pageCount) ->
     {staticPath, gifIcon} = Build
+    {tn_w, tn_h} = data
 
     if data.spoiler and !Conf['Reveal Spoiler Thumbnails']
       src = "#{staticPath}spoiler"
@@ -202,11 +203,14 @@ Build =
         src += ("-#{thread.board}") + Math.floor 1 + spoilerRange * Math.random()
       src += '.png'
       imgClass = 'spoiler-file'
+      cssText = "--tn-w: 100; --tn-h: 100;"
     else if data.filedeleted
       src = "#{staticPath}filedeleted-res#{gifIcon}"
       imgClass = 'deleted-file'
     else if thread.OP.file
       src = thread.OP.file.thumbURL
+      ratio = 250 / Math.max(tn_w, tn_h)
+      cssText = "--tn-w: #{tn_w * ratio}; --tn-h: #{tn_h * ratio};"
     else
       src = "#{staticPath}nofile.png"
       imgClass = 'no-file'
@@ -222,6 +226,7 @@ Build =
       id: "t#{thread}"
     $.addClass root, thread.OP.highlights... if thread.OP.highlights
     $.addClass root, 'noFile' unless thread.OP.file
+    root.style.cssText = cssText or ''
 
     root
 
diff --git a/src/css/style.css b/src/css/style.css
index 12a019b56..167e6a632 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -940,12 +940,18 @@ div[data-checked="false"] > .suboption-list {
   width: 96px;
   height: 96px;
 }
+:root.hats-enabled:not(.werkTyme) .catalog-small > .catalog-thread:not(.noFile)::after {
+  left: calc(67px - .3px * var(--tn-w));
+}
 :root.hats-enabled .catalog-large > .catalog-thread::after {
   left: -15px;
   top: -98px;
   width: 160px;
   height: 160px;
 }
+:root.hats-enabled:not(.werkTyme) .catalog-large > .catalog-thread:not(.noFile)::after {
+  left: calc(110px - .5px * var(--tn-w));
+}
 
 /* Announcement Hiding */
 :root.hide-announcement #globalMessage {