diff --git a/webpage/channel.ts b/webpage/channel.ts
index 7d5eb5a..fa8b751 100644
--- a/webpage/channel.ts
+++ b/webpage/channel.ts
@@ -628,7 +628,13 @@ class Channel{
         this.localuser.channelfocus=this;
         const prom=this.infinite.delete();
         history.pushState(null, null,"/channels/"+this.guild_id+"/"+this.snowflake);
+
         document.getElementById("channelname").textContent="#"+this.name;
+        if (this.topic) {
+            document.getElementById("channelTopic").textContent=this.topic;
+            document.getElementById("channelTopic").removeAttribute("hidden");
+        } else document.getElementById("channelTopic").setAttribute("hidden","");
+
         const loading=document.getElementById("loadingdiv");
         Channel.regenLoadingMessages();
         loading.classList.add("loading");
diff --git a/webpage/direct.ts b/webpage/direct.ts
index 46276c3..a00361e 100644
--- a/webpage/direct.ts
+++ b/webpage/direct.ts
@@ -141,6 +141,7 @@ class Group extends Channel{
         this.buildmessages();
         history.pushState(null, null,"/channels/"+this.guild_id+"/"+this.snowflake);
         document.getElementById("channelname").textContent="@"+this.name;
+        document.getElementById("channelTopic").setAttribute("hidden","");
         document.getElementById("typebox").contentEditable=""+true;
     }
     messageCreate(messagep){
diff --git a/webpage/index.html b/webpage/index.html
index 33cf0ba..989a773 100644
--- a/webpage/index.html
+++ b/webpage/index.html
@@ -51,7 +51,9 @@
         </div>
         <div class="flexttb messageflex">
             <div class="servertd channelnamediv">
-                <span id="mobileback" hidden></span><span id="channelname">Channel</span>
+                <span id="mobileback" hidden></span>
+                <span id="channelname">Channel name</span>
+                <span id="channelTopic" hidden>Channel topic</span>
             </div>
             <div id="channelw">
                 <div id="loadingdiv">
diff --git a/webpage/style.css b/webpage/style.css
index 0757095..53e7fec 100644
--- a/webpage/style.css
+++ b/webpage/style.css
@@ -384,7 +384,7 @@ div {
 	max-height: 1.5in;
 	overflow-y: auto;
 	flex-grow:1;
-	
+
 }
 #realbox{
 	padding: .05in;
@@ -1798,7 +1798,7 @@ form div{
 	background: var(--textarea-bg);
 	span{
 		text-wrap:nowrap;
-		
+
 	}
 ;
 	display: flex;
@@ -1819,7 +1819,7 @@ form div{
 	border:solid .03in var(--black);
 }
 .copybutton{
-	
+
 	width:.25in;
 }
 .copycontainer{
@@ -1925,3 +1925,7 @@ form div{
 	border-radius:.1in;
 	height:17px;
 }
+
+#channelTopic {
+	margin-left: 10px;
+}