diff --git a/web/_data/community-content.json b/web/_data/community-content.json
new file mode 100644
index 0000000..a1d3dd1
--- /dev/null
+++ b/web/_data/community-content.json
@@ -0,0 +1,24 @@
+[
+    {
+        "name": "Itty for Tiny Life",
+        "slug": "itty",
+        "desc": "Itty adds a social media site (called Itty) that allows your Tinies to interact digitally!",
+        "author": "ssblur",
+        "section": "mods",
+        "links": {
+            "Steam": "https://steamcommunity.com/sharedfiles/filedetails/?id=2965803577",
+            "YouTube": "https://www.youtube.com/channel/UC87-8FM-U9OSUYCzIqlhztA"
+        }
+    },
+    {
+        "name": "Itty for Tiny Life",
+        "slug": "itty",
+        "desc": "Itty adds a social media site (called Itty) that allows your Tinies to interact digitally!",
+        "author": "ssblur",
+        "section": "mods",
+        "links": {
+            "Steam": "https://steamcommunity.com/sharedfiles/filedetails/?id=2965803577",
+            "YouTube": "https://www.youtube.com/channel/UC87-8FM-U9OSUYCzIqlhztA"
+        }
+    }
+]
diff --git a/web/_data/community-sections.json b/web/_data/community-sections.json
new file mode 100644
index 0000000..cc923c4
--- /dev/null
+++ b/web/_data/community-sections.json
@@ -0,0 +1,32 @@
+[
+    {
+        "name": "🔨 Mods",
+        "slug": "mods",
+        "desc": "Mods are cool!"
+    },
+    {
+        "name": "🫂 Households",
+        "slug": "households",
+        "desc": "Households are cool!"
+    },
+    {
+        "name": "🏠 Lots",
+        "slug": "lots",
+        "desc": "Lots are cool!"
+    },
+    {
+        "name": "🌍 Worlds",
+        "slug": "worlds",
+        "desc": "Worlds are cool!"
+    },
+    {
+        "name": "📽️ Media",
+        "slug": "media",
+        "desc": "Media is cool!"
+    },
+    {
+        "name": "🎨 Fanart",
+        "slug": "fanart",
+        "desc": "Fanart is cool!"
+    }
+]
diff --git a/web/_includes/about.html b/web/_includes/about.html
index 1a7dc71..45980cf 100644
--- a/web/_includes/about.html
+++ b/web/_includes/about.html
@@ -9,7 +9,7 @@
             <div class="feature-title">
                 <h2>{{ item.title }}</h2>
             </div>
-            <img src="media/banners/{{ item.value }}" alt="{{ item.alt }}" width="100%" class="screen">
+            <img src="media/banners/{{ item.value }}" alt="{{ item.alt }}" width="100%">
         </div>
         <ul>
             {% for line in item.text %}
diff --git a/web/_includes/blognav.html b/web/_includes/blognav.html
index 2152329..2f35f9a 100644
--- a/web/_includes/blognav.html
+++ b/web/_includes/blognav.html
@@ -1,4 +1,4 @@
-<a class="nav-item nav-link" href="../../#devlogs">🏡 Back to Main Page</a>
+<a class="nav-item nav-link" href="../../#devlogs">🏡 Home</a>
 {% if page.previous %}
     <a class="nav-item nav-link" href="{{ page.previous.url }}">⏮️ Previous Post</a>
 {% endif %}
diff --git a/web/_includes/communitynav.html b/web/_includes/communitynav.html
new file mode 100644
index 0000000..9e83161
--- /dev/null
+++ b/web/_includes/communitynav.html
@@ -0,0 +1,4 @@
+<a class="nav-item nav-link" href="../../">🏡 Home</a>
+{% for section in site.data.community-sections %}
+    <a class="nav-item nav-link" href="#{{ section.slug }}">{{ section.name }}</a>
+{% endfor %}
diff --git a/web/_includes/indexnav.html b/web/_includes/indexnav.html
index c23d84b..a82bbb6 100644
--- a/web/_includes/indexnav.html
+++ b/web/_includes/indexnav.html
@@ -1,5 +1,6 @@
 <a class="nav-item nav-link" href="#top">🎮 Play</a>
 <a class="nav-item nav-link" href="#about">🏡 About</a>
 <a class="nav-item nav-link" href="#social">🔗 Social</a>
-<a class="nav-item nav-link" href="#devlogs">📢 News and Devlogs</a>
+<a class="nav-item nav-link" href="#devlogs">📢 News</a>
 <a class="nav-item nav-link" href="#roadmap">🛣️ Roadmap</a>
+<a class="nav-item nav-link" href="community">💬 Community</a>
diff --git a/web/community.html b/web/community.html
new file mode 100644
index 0000000..2957248
--- /dev/null
+++ b/web/community.html
@@ -0,0 +1,41 @@
+---
+layout: default
+nav: communitynav.html
+title: Tiny Life
+summary: A fun simulation game where you mess with people's lives
+---
+
+<div class="section community-top">
+    <h1>💬 Community Showcase</h1>
+    Tiny Life's community is awesome, blah blah blah
+</div>
+
+{% for section in site.data.community-sections %}
+    <div class="section">
+        <h2 id="{{ section.slug }}">{{ section.name }}</h2>
+        <p>{{ section.desc }}</p>
+
+        {% for content in site.data.community-content %}
+            {% if content.section == section.slug %}
+                <div class="community-content">
+                    <div class="community-content-box">
+                        <div class="community-content-box-content">
+                            <h4 class="community-title">{{ content.name }}</h4>
+                            <div class="community-author text-muted">Created by {{ content.author }}</div>
+                            <div class="community-desc">{{ content.desc }}</div>
+                            <div>
+                                {% for link in content.links %}
+                                    <a href="{{ link[1] }}">{{ link[0] }}</a>
+                                    {% unless forloop.last %}
+                                        &ndash;
+                                    {% endunless %}
+                                {% endfor %}
+                            </div>
+                        </div>
+                        <img id="{{ content.slug }}" src="/media/community/{{ content.slug }}.png" alt="An image showing off {{ content.name }}" width="100%">
+                    </div>
+                </div>
+            {% endif %}
+        {% endfor %}
+    </div>
+{% endfor %}
diff --git a/web/media/community/itty.png b/web/media/community/itty.png
new file mode 100644
index 0000000..0e44c00
Binary files /dev/null and b/web/media/community/itty.png differ
diff --git a/web/style.css b/web/style.css
index 6dba852..35c1f48 100644
--- a/web/style.css
+++ b/web/style.css
@@ -48,7 +48,7 @@ pre.highlight {
 
 .blog-section {
     max-width: 700px;
-    margin-top: 80px;
+    margin-top: 70px;
 }
 
 .blog-section img {
@@ -79,7 +79,8 @@ pre.highlight {
     margin-bottom: 40px;
 }
 
-.feature-banner {
+.feature-banner,
+.community-content-box {
     position: relative;
 }
 
@@ -87,8 +88,9 @@ pre.highlight {
     margin-top: 1rem;
 }
 
-.feature-title {
-    margin: 10px;
+.feature-title,
+.community-content-box-content {
+    margin-top: 10px;
     padding: 10px;
     color: white;
     background: rgb(0, 0, 0, 0.7);
@@ -100,6 +102,25 @@ pre.highlight {
     white-space: nowrap;
 }
 
+.community-content-box-content {
+    margin: 0;
+    top: auto;
+    bottom: 30px;
+    white-space: initial;
+}
+
+.community-content {
+    margin: 25px auto;
+}
+
+.community-title {
+    white-space: nowrap;
+}
+
+.community-desc {
+    display: block;
+}
+
 .feature-title h2 {
     margin-bottom: 0;
 }
@@ -117,11 +138,14 @@ pre.highlight {
     margin-right: 20px;
 }
 
-.devlog-date {
+.devlog-date,
+.community-desc,
+.community-author {
     margin-bottom: 10px;
 }
 
-.devlog-title {
+.devlog-title,
+.community-title {
     margin-bottom: 0;
 }
 
@@ -182,6 +206,10 @@ pre.highlight {
     font-style: italic;
 }
 
+.community-top {
+    margin-top: 70px;
+}
+
 body.dark-mode {
     color: #d8d8d8;
     background-color: #1b1b1b;