diff --git a/app/editor/components/Styles.ts b/app/editor/components/Styles.ts
index 784e224b8..b17a7bd94 100644
--- a/app/editor/components/Styles.ts
+++ b/app/editor/components/Styles.ts
@@ -63,6 +63,15 @@ const EditorStyles = styled.div<{
       margin-bottom: 0.25em;
     }
 
+    // all of heading sizes are stepped down one from global styles, except h1
+    // which is between h1 and h2
+    h1 { font-size: 1.75em; }
+    h2 { font-size: 1.25em; }
+    h3 { font-size: 1em; }
+    h4 { font-size: 0.875em; }
+    h5 { font-size: 0.75em; }
+    h6 { font-size: 0.75em; }
+
     .ProseMirror-yjs-cursor {
       position: relative;
       margin-left: -1px;
diff --git a/app/scenes/Document/components/Contents.tsx b/app/scenes/Document/components/Contents.tsx
index cbfff513e..d7eb30584 100644
--- a/app/scenes/Document/components/Contents.tsx
+++ b/app/scenes/Document/components/Contents.tsx
@@ -58,7 +58,7 @@ export default function Contents({ headings, isFullWidth }: Props) {
         {headings.length ? (
           <List>
             {headings
-              .filter((heading) => heading.level >= 4)
+              .filter((heading) => heading.level < 4)
               .map((heading) => (
                 <ListItem
                   key={heading.id}