diff --git a/assets/base.scss b/assets/base.scss
index 7d3acdc0d..c9340a9b2 100644
--- a/assets/base.scss
+++ b/assets/base.scss
@@ -81,12 +81,8 @@ p, tbody, li {
   line-height: 1.5em;
 }
 
-h2 {
-  opacity: 0.85;
-}
-
-h3 {
-  opacity: 0.75;
+h2, h3 {
+  opacity: 0.9;
 }
 
 blockquote {
@@ -378,3 +374,25 @@ header {
     }
   }
 }
+
+.section-ul {
+  list-style: none;
+  padding-left: 0;
+
+  & > li {
+    border: 1px solid var(--outlinegray);
+    border-radius: 5px;
+    padding: 0 1em;
+    margin-bottom: 1em;
+
+    & h3 {
+      opacity: 1;
+      font-weight: 700;
+      margin-bottom: 0em;
+    }
+
+    & .meta {
+      opacity: 0.6;
+    }
+  }
+}
\ No newline at end of file
diff --git a/config.toml b/config.toml
index 109734180..e4f3d0ac1 100644
--- a/config.toml
+++ b/config.toml
@@ -8,6 +8,7 @@ ignoreFiles = [
     "/content/templates/*",
     "/content/private/*",
 ]
+summaryLength = 35
 
 [markup]
     [markup.tableOfContents]
diff --git a/content/_index.md b/content/_index.md
index be2b78f09..8c3a0eb69 100644
--- a/content/_index.md
+++ b/content/_index.md
@@ -7,12 +7,19 @@ Host your second brain and [digital garden](https://jzhao.xyz/posts/digital-gard
 3. Display for backlinks of each note
 4. A customizable graph view
 5. Endlessly powerful page and theme customization
+6. Automatically generated tag and section lists of content
 
 ## Get Started
 > 📚 [Setup your own digital garden using Quartz](notes/setup.md)
 
 Not convinced yet? Look at some [community digital gardens](moc/showcase) built with Quartz, or read about [why I made Quartz](notes/philosophy.md) to begin with!
 
+## Content Lists
+If you prefer browsing the contents of this site through a list instead of a graph, you can find content lists here too:
+
+- [All Notes](/notes)
+- [Setup-related Notes](/tags/setup)
+
 ## Troubleshooting
 - 🚧 [Troubleshooting and FAQ](notes/troubleshooting.md)
 - 🐛 [Submit an Issue](https://github.com/jackyzha0/quartz/issues)
diff --git a/layouts/_default/section.html b/layouts/_default/section.html
index e69de29bb..d6e24b4fa 100644
--- a/layouts/_default/section.html
+++ b/layouts/_default/section.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html lang="en">
+{{ partial "head.html" . }}
+
+<body>
+{{partial "search.html" .}}
+<div class="singlePage">
+    <!-- Begin actual content -->
+    <header>
+        <h1 id="page-title"><a href="{{ .Site.BaseURL }}">{{ .Site.Data.config.page_title }}</a></h1>
+        <svg tabindex="0" id="search-icon" aria-labelledby="title desc" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.9 19.7"><title id="title">Search Icon</title><desc id="desc">Icon to open search</desc><g class="search-path" fill="none"><path stroke-linecap="square" d="M18.5 18.3l-5.4-5.4"/><circle cx="8" cy="8" r="7"/></g></svg>
+        <div class="spacer"></div>
+        {{partial "darkmode.html" .}}
+    </header>
+    <article>
+        <h1>All {{.Title}}</h1>
+        <ul class="section-ul">
+            {{- range .Pages -}}
+            <li class="section-li">
+                <div class="section">
+                    <div class="desc">
+                        <h3><a href="{{ .Permalink }}">{{- .Title -}}</a></h3>
+                        <p>{{- .Summary -}}{{if .Truncated}}...{{end}}</p>
+                    </div>
+                    <p class="meta">
+                        {{ .ReadingTime }} minute read
+                    </p>
+                </div>
+            </li>
+            {{- end -}}
+        </ul>
+    </article>
+    {{partial "contact.html" .}}
+</div>
+</body>
+
+</html>
diff --git a/layouts/partials/contact.html b/layouts/partials/contact.html
new file mode 100644
index 000000000..748cb0615
--- /dev/null
+++ b/layouts/partials/contact.html
@@ -0,0 +1,12 @@
+<!-- Contact Info -->
+<div id="contact_buttons">
+    <footer>
+        <p>Made by {{ $.Site.Data.config.name }} using <a href="https://github.com/jackyzha0/quartz">Quartz</a>, © {{ dateFormat "2006" now }}</p>
+        {{ if not .IsHome }}
+        <a href="/">Home</a>
+        {{end}}
+        {{- range $.Site.Data.config.links -}}
+        <a href="{{.link}}">{{.link_name}}</a>
+        {{- end -}}
+    </footer>
+</div>
\ No newline at end of file
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index 416b16733..6d4ef17b9 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -8,15 +8,4 @@
     </div>
 </div>
 
-<!-- Contact Info -->
-<div id="contact_buttons">
-    <footer>
-        <p>Made by {{ $.Site.Data.config.name }} using <a href="https://github.com/jackyzha0/quartz">Quartz</a>, © {{ dateFormat "2006" now }}</p>
-        {{ if not .IsHome }}
-        <a href="/">Home</a>
-        {{end}}
-        {{- range $.Site.Data.config.links -}}
-        <a href="{{.link}}">{{.link_name}}</a>
-        {{- end -}}
-    </footer>
-</div>
\ No newline at end of file
+{{partial "contact.html" .}}
\ No newline at end of file
