diff --git a/src/core/client/stream/components/Comment.css b/src/core/client/stream/components/Comment.css
index 3981c1eee..c7f11300a 100644
--- a/src/core/client/stream/components/Comment.css
+++ b/src/core/client/stream/components/Comment.css
@@ -5,3 +5,7 @@
 .gutterBottom {
   margin-bottom: calc(2px * $spacing-unit);
 }
+
+.topBar {
+  margin-bottom: calc(1px * $spacing-unit);
+}
diff --git a/src/core/client/stream/components/Comment.tsx b/src/core/client/stream/components/Comment.tsx
index 2f91166ed..f293a0fe0 100644
--- a/src/core/client/stream/components/Comment.tsx
+++ b/src/core/client/stream/components/Comment.tsx
@@ -22,7 +22,9 @@ const Comment: StatelessComponent<CommentProps> = props => {
   });
   return (
     <div className={rootClassName}>
-      {props.author && <Username>{props.author.username}</Username>}
+      <div className={styles.topBar}>
+        {props.author && <Username>{props.author.username}</Username>}
+      </div>
       <Typography>{props.body}</Typography>
     </div>
   );
diff --git a/src/core/client/stream/components/Username.css b/src/core/client/stream/components/Username.css
index 5f84423cd..9cb1baa15 100644
--- a/src/core/client/stream/components/Username.css
+++ b/src/core/client/stream/components/Username.css
@@ -1,3 +1,3 @@
 .root {
-  font-weight: $font-weight-medium;
+  composes: heading4 from "talk-ui/shared/typography.css";
 }
diff --git a/src/core/client/stream/components/Username.tsx b/src/core/client/stream/components/Username.tsx
index 03a730121..117ebdb3d 100644
--- a/src/core/client/stream/components/Username.tsx
+++ b/src/core/client/stream/components/Username.tsx
@@ -1,8 +1,6 @@
 import React from "react";
 import { StatelessComponent } from "react";
 
-import { Typography } from "talk-ui/components";
-
 import * as styles from "./Username.css";
 
 export interface CommentProps {
@@ -10,11 +8,7 @@ export interface CommentProps {
 }
 
 const Username: StatelessComponent<CommentProps> = props => {
-  return (
-    <Typography className={styles.root} variant="heading2" gutterBottom>
-      {props.children}
-    </Typography>
-  );
+  return <span className={styles.root}>{props.children}</span>;
 };
 
 export default Username;