diff --git a/web/README b/web/README
new file mode 100644
index 000000000..128487623
--- /dev/null
+++ b/web/README
@@ -0,0 +1,19 @@
+# Transmission Web Client
+
+A web interface is built into all Transmission flavors, enabling them to be controlled remotely.
+
+## Developing locally
+
+First, in this web directory, run `npm i` to install all dependencies. (You’ll need to have node and npm installed, of course.)
+
+Run `npm run dev` to compile the source javascript files into a bundle, then navigate to [localhost:9000](http://localhost:9000/).
+
+Webpack will automatically compile on save, so you should see any changes reflected immediately.
+
+## Anonymizing your data for screenshots
+
+Use this bookmarklet to anonymize your torrent names before submitting a screenshot:
+
+`javascript:void%20function(){const%20a=document.getElementsByClassName(%22torrent-name%22);for(const%20b%20of%20a)console.log(b),b.textContent=%22Lorem%20ipsum%20dolor%20sit%20amet.iso%22}();`
+
+You’ll typically have about 3 seconds before the next batch of RPC updates overwrite the text content of any currently-downloading files.
\ No newline at end of file
diff --git a/web/assets/css/transmission-app.scss b/web/assets/css/transmission-app.scss
index 72618a297..072d42c91 100644
--- a/web/assets/css/transmission-app.scss
+++ b/web/assets/css/transmission-app.scss
@@ -390,22 +390,30 @@ $toolbar-height: $toolbar-height-number * 1px;
   }
 }
 
-$speed-icon-size: 12px;
+$speed-icon-size: 20px;
 
 .speed-up-icon {
-  background-image: url($image-chevron-up);
-  background-repeat: no-repeat;
-  background-size: $speed-icon-size $speed-icon-size;
-  height: $speed-icon-size;
-  width: $speed-icon-size;
+  fill: var(--color-fg-primary);
+  margin: 0 auto;
+
+  svg {
+    width: $speed-icon-size;
+  }
 }
 
 .speed-dn-icon {
-  background-image: url($image-chevron-dn);
-  background-repeat: no-repeat;
-  background-size: $speed-icon-size $speed-icon-size;
-  height: $speed-icon-size;
-  width: $speed-icon-size;
+  fill: var(--color-fg-primary);
+  margin: 0 auto;
+
+  svg {
+    width: $speed-icon-size;
+  }
+}
+
+#speed-dn-label,
+#speed-up-label {
+  width: 70px;
+  text-align: right;
 }
 
 /// TORRENT CONTAINER
@@ -1238,6 +1246,10 @@ $video-image: '../img/film.svg';
 
   .percent-done {
     width: 10%;
+
+    @include for-phone-only {
+      width: 12%;
+    }
   }
 
   .speed-down,
@@ -1247,17 +1259,21 @@ $video-image: '../img/film.svg';
 
   .peer-address {
     width: 25%;
+    overflow-x: hidden;
+    text-overflow: ellipsis;
+
+    @include for-phone-only {
+      text-align: left;
+      width: 20%;
+    }
   }
 
   .peer-app-name {
     overflow-x: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    @include for-phone-only {
-      display: none;
-    }
     @include for-tablet-portrait-up {
-      width: 25%;
+      width: 20%;
     }
   }
 
@@ -1539,7 +1555,7 @@ $logo-size: 64px;
 }
 @include for-tablet-portrait-up {
   .dialog-container {
-    min-width: 400px;
+    min-width: 500px;
     position: absolute;
     top: $popup-top * 2;
   }
@@ -1682,6 +1698,11 @@ dialog {
   #auto-start-label {
     margin-left: 5px;
   }
+
+  input[type='file'] {
+    width: 100%;
+    box-sizing: border-box;
+  }
 }
 
 /// HOTKEYS DIALOG
diff --git a/web/public_html/index.html b/web/public_html/index.html
index 10733cdf7..b9c44a324 100755
--- a/web/public_html/index.html
+++ b/web/public_html/index.html
@@ -200,9 +200,39 @@
         <input type="search" id="torrent-search" placeholder="Filter" />
         <span id="filter-count">&nbsp;</span>
         <span class="flex"></span>
-        <div class="speed-dn-icon"></div>
+        <div class="speed-dn-icon">
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            width="32"
+            height="32"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            class="feather feather-chevron-down"
+          >
+            <polyline points="6 9 12 15 18 9"></polyline>
+          </svg>
+        </div>
         <div id="speed-dn-label"></div>
-        <div class="speed-up-icon"></div>
+        <div class="speed-up-icon">
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            width="32"
+            height="32"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            class="feather feather-chevron-up"
+          >
+            <polyline points="18 15 12 9 6 15"></polyline>
+          </svg>
+        </div>
         <div id="speed-up-label"></div>
       </header>