diff --git a/web/settings/account-settings.css b/web/settings/account-settings.css
--- a/web/settings/account-settings.css
+++ b/web/settings/account-settings.css
@@ -8,3 +8,23 @@
   font-weight: var(--semi-bold);
   line-height: var(--line-height-display);
 }
+
+.content {
+  margin-top: 55px;
+}
+
+.content ul {
+  list-style-type: none;
+}
+
+.content li {
+  color: var(--account-settings-label);
+  border-bottom: 1px solid var(--border-color);
+  padding: 16px;
+  margin-bottom: 8px;
+}
+
+.username {
+  color: var(--fg);
+  word-break: break-word;
+}
diff --git a/web/settings/account-settings.react.js b/web/settings/account-settings.react.js
--- a/web/settings/account-settings.react.js
+++ b/web/settings/account-settings.react.js
@@ -2,12 +2,29 @@
 
 import * as React from 'react';
 
+import { useSelector } from '../redux/redux-utils';
 import css from './account-settings.css';
 
 function AccountSettings(): React.Node {
+  const currentUserInfo = useSelector(state => state.currentUserInfo);
+  const username =
+    currentUserInfo && !currentUserInfo.anonymous
+      ? currentUserInfo.username
+      : undefined;
+
   return (
     <div className={css.container}>
       <h4 className={css.header}>My Account</h4>
+      <div className={css.content}>
+        <ul>
+          <li>
+            <p>
+              {'Logged in as '}
+              <span className={css.username}>{username}</span>
+            </p>
+          </li>
+        </ul>
+      </div>
     </div>
   );
 }
diff --git a/web/theme.css b/web/theme.css
--- a/web/theme.css
+++ b/web/theme.css
@@ -107,4 +107,5 @@
   --thread-menu-color-hover: var(--shades-white-100);
   --thread-menu-color-dangerous: var(--error-primary);
   --thread-menu-color-dangerous-hover: var(--error-light-50);
+  --account-settings-label: var(--shades-black-60);
 }