diff --git a/webui/src/components/BrowseColumn.svelte b/webui/src/components/BrowseColumn.svelte
index 6a0ca5a..017e5f7 100644
--- a/webui/src/components/BrowseColumn.svelte
+++ b/webui/src/components/BrowseColumn.svelte
@@ -17,9 +17,13 @@
   }
 </script>
 
-<div class="view">
+<div class="view" class:editable>
   <header>
-    <IconButton name="pencil" on:click={() => (editable = !editable)} />
+    <IconButton
+      name="pencil"
+      on:click={() => (editable = !editable)}
+      active={editable}
+    />
     <IconButton name="bookmark" on:click={() => visit()} disabled={only} />
     <IconButton
       name="x-circle"
@@ -44,6 +48,10 @@
     border-radius: 0.5em;
     padding: 1rem;
 
+    &.editable {
+      border-style: dashed;
+    }
+
     header {
       font-size: 20px;
       position: relative;