diff --git a/readme.md b/readme.md
index 7cf5d44..939fdb0 100644
--- a/readme.md
+++ b/readme.md
@@ -9,6 +9,9 @@ A [Django](https://www.djangoproject.com) application that renders a static temp
 3. Create a virtual environment: `python3 -m venv .venv`
 4. Enter the virtual environment: `source .venv/bin/activate`
 5. Install dependencies: `pip install -r requirements.txt`
+6. Enter the app: `cd social_links`
+7. Run migrations: `python3 manage.py migrate`
+8. Run development server: `python3 manage.py runserver`
 
 ## Getting started for deployment
 
diff --git a/social_links/links/static/cover.css b/social_links/links/static/cover.css
index 83eb249..947b42e 100644
--- a/social_links/links/static/cover.css
+++ b/social_links/links/static/cover.css
@@ -17,8 +17,9 @@
  */
 
 body {
-  text-shadow: 0 .05rem .1rem rgba(0, 0, 0, .5);
-  box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5);
+  text-shadow: 0 .05rem .1rem rgba(0, 0, 0, 0.5);
+  box-shadow: inset 0 0 25rem rgba(5, 205, 255, 0.103);
+  background-color: rgba(36, 36, 36, 0.808);
 }
 
 .cover-container {
@@ -77,3 +78,4 @@ body {
 main {
   margin-top: -5.5rem;
 }
+
diff --git a/social_links/links/templates/links/index.html b/social_links/links/templates/links/index.html
index 0de7be2..ca17a9e 100644
--- a/social_links/links/templates/links/index.html
+++ b/social_links/links/templates/links/index.html
@@ -11,47 +11,46 @@
 
     {% load django_bootstrap5 %}
     {% bootstrap_css %}
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
 
     {% load static %}
     <link href="{% static 'cover.css' %}" rel="stylesheet">
 </head>
-<body class="d-flex h-100 text-center text-bg-dark">
+<body class="d-flex h-100 text-center text-light">
 
     <div class="cover-container d-flex w-100 h-100 p-3 mx-auto flex-column">
         <header class="mb-auto">
             <div>
-                <h3 class="masthead-brand float-md-start mb-0"><a href="https://c0de.fox.pet"><img style="width: 12rem;" src="https://c0defox.es/paw-tail.svg" /></a></h3>
+                <h3 class="masthead-brand float-md-start mb-0"><a href="{{ heading.link }}"><img style="width: 12rem" src="https://c0defox.es/paw-tail.svg" /></a></h3>
                 <nav class="nav nav-masthead justify-content-center float-md-end">
-                    <a class="nav-link fw-bold py-1 px-0 active" href="https://c0defox.es"><i class="fas fa-home"></i> Home</a>
-                    <a class="nav-link fw-bold py-1 px-0" href="https://storage.c0de.cloud" title="Personal cloud"><i class="fal fa-cloud"></i> c0de.cloud</a>
-                    <a class="nav-link fw-bold py-1 px-0" href="https://lob.li" title="Link Shortener"><i class="fas fa-compress-alt"></i> lob.li</a>
-                    <a class="nav-link fw-bold py-1 px-0" href="https://xn--l3h7012o.ws" title="foxcloud :3">🦊☁️</a>
+                    <a class="nav-link fw-bold py-1 px-0 active" href="{{ heading.link }}"><i class="bi bi-house-door-fill"></i> Home</a>
+
+                    {% for link in nav_links %}
+                    <a class="nav-link fw-bold py-1 px-0" href="{{ link.value }}" title="{{ link.title }}"><i class="bi bi-{{ link.bootstrap_icon_class }}"></i> {{ link.text }}</a>{% endfor %}
                 </nav>
             </div>
         </header>
 
-        {% bootstrap_alert "Something went wrong" alert_type="danger" %}
-
         <main role="main" class="px-3">
-            <h1 class="cover-heading"><a href="https://c0de.fox.pet"><img src="https://secure.gravatar.com/avatar/1e346a54257cf0a9932fcfc1e61c015d?s=200" /></a></h1>
-            <h1 class="cover-heading">c0de</h1>
-            <p class="lead">Some weird fox on the internet</p>
-            <p class="lead"></p>
+            <h1 class="cover-heading"><a href="{{ heading.link }}"><img src="{{ favicon }}?s=200" /></a></h1>
+            <h1 class="cover-heading">{{ heading.main }}</h1>
+            <p class="lead">{{ heading.secondary }}</p>
+            <p class="lead"></p>{% if links %}
             <p class="lead">Here's some ways to get in touch with me</p>
-            <p class="lead">
-                <a href="https://teitter.com/foxyc0de" class="btn btn-secondary"><i class="bi bi-twitter"></i> Twitter</a>
-                <a href="https://t.me/c0defox" class="btn btn-secondary"><i class="bi bi-telegram"></i> Telegram</a>
-                <a href="https://github.com/alopexc0de" class="btn btn-secondary"><i class="bi bi-github"></i> Github</a>
-                <a href="https://keybase.io/alopexc0de" class="btn btn-secondary"><i class="bi bi-keycdn"></i> Keybase</a>
-                <a href="https://www.reddit.com/user/alopexc0de" class="btn btn-secondary"><i class="bi bi-reddit"></i> Reddit</a>
-                <a href="https://discord.com/users/c0de#0689" class="btn btn-secondary"><i class="bi bi-discord"></i> Discord</a>
-                <a href="http://steamcommunity.com/id/c0defox" class="btn btn-secondary"><i class="bi bi-steam"></i> Steam</a>
-            </p>
+            <p class="lead">{% for link in links %}
+                <a href="{{ link.value }}" class="btn btn-secondary"><i class="bi bi-{{ link.bootstrap_icon_class }}"></i> {{ link.title }}</a>{% endfor %}
+            </p>{% endif %}
         </main>
 
+        {% if alert %}
+        {% bootstrap_alert alert.data alert_type=alert.level %}
+        {% endif %}
+
+        {% if footer %}
         <footer class="mt-auto text-white-50">
-            <p>I'm apparently unique enough to have a name that others don't; ask one of my known accounts if unsure.</p>
+            <p>{{ footer }}</p>
         </footer>
+        {% endif %}
     </div>
 
     {% bootstrap_javascript %}
diff --git a/social_links/links/views.py b/social_links/links/views.py
index c663cf2..a0f6a8f 100644
--- a/social_links/links/views.py
+++ b/social_links/links/views.py
@@ -4,10 +4,66 @@ EXTRA_HEADERS = '<meta name="p:domain_verify" content="b91d67cb075510218cbaf2146
 
 
 def index(request):
-    return render(request, "links/index.html", {
-        'title': 'c0defox.es',
-        'author': 'c0de',
-        'favicon': 'https://secure.gravatar.com/avatar/1e346a54257cf0a9932fcfc1e61c015d',
-        'extra_headers': EXTRA_HEADERS
-    })
-
+    return render(
+        request,
+        "links/index.html",
+        {
+            "title": "c0defox.es",
+            "author": "c0de",
+            "favicon": "https://secure.gravatar.com/avatar/1e346a54257cf0a9932fcfc1e61c015d",
+            "extra_headers": EXTRA_HEADERS,
+            "alert": {"level": "warning", "data": "awoo :3"},
+            "links": [
+                {
+                    "id": "1234567890",
+                    "value": "https://example.com",
+                    "title": "Link 1",
+                    "bootstrap_icon_class": "telegram",
+                },
+                {
+                    "id": "1234567890",
+                    "value": "https://example.com",
+                    "title": "Link 2",
+                    "bootstrap_icon_class": "git",
+                },
+                {
+                    "id": "1234567890",
+                    "value": "https://example.com",
+                    "title": "Link 3",
+                    "bootstrap_icon_class": "discord",
+                },
+                {
+                    "id": "1234567890",
+                    "value": "https://example.com",
+                    "title": "Link 4",
+                    "bootstrap_icon_class": "mastodon",
+                },
+            ],
+            "heading": {
+                "link": "https://c0de.fox.pet",
+                "main": "c0de",
+                "secondary": "Some weird fox on the internet",
+            },
+            "footer": "I'm apparently unique enough to have a name that others don't; ask one of my known accounts if unsure.",
+            "nav_links": [
+                {
+                    "value": "https://xn--l3h7012o.ws",
+                    "title": "foxcloud",
+                    "text": "🦊☁️",
+                    "bootstrap_icon_class": ""
+                },
+                {
+                    "value": "https://xn--l3h7012o.ws",
+                    "title": "foxcloud",
+                    "text": "🦊☁️",
+                    "bootstrap_icon_class": ""
+                },
+                {
+                    "value": "https://xn--l3h7012o.ws",
+                    "title": "foxcloud",
+                    "text": "🦊☁️",
+                    "bootstrap_icon_class": ""
+                },
+            ],
+        },
+    )
