diff --git a/renderer/index.css b/renderer/index.css
index 4568754c..9975a0e4 100644
--- a/renderer/index.css
+++ b/renderer/index.css
@@ -266,7 +266,7 @@ body.drag::before {
   bottom: 20px;
 }
 
-.torrent .status :not(:last-child)::after {
+.torrent span:not(:last-child)::after {
   content: ' — ';
 }
 
diff --git a/renderer/views/torrent-list.js b/renderer/views/torrent-list.js
index ede1b111..7ab87cc4 100644
--- a/renderer/views/torrent-list.js
+++ b/renderer/views/torrent-list.js
@@ -49,16 +49,18 @@ function renderTorrent (state, dispatch, torrent) {
 
 // Renders the torrent name and download progress
 function renderTorrentMetadata (torrent) {
+  var progress = Math.floor(100 * torrent.progress)
   return hx`
     <div class="metadata">
       <div class="name ellipsis">${torrent.name || 'Loading torrent...'}</div>
       <div class="status">
-        <span class="progress">${Math.floor(100 * torrent.progress)}%</span>
+        <span class="progress">${progress}%</span>
+        <span>${prettyBytes((torrent.length / 100) * progress)} / ${prettyBytes(torrent.length)}</span>
       </div>
       ${getFilesLength()}
       <span>${getPeers()}</span>
-      <span>${prettyBytes(torrent.downloadSpeed)}/s</span>
-      <span>${prettyBytes(torrent.uploadSpeed)}/s</span>
+      <span>↓ ${prettyBytes(torrent.downloadSpeed)}/s</span>
+      <span>↑ ${prettyBytes(torrent.uploadSpeed)}/s</span>
     </div>
   `