diff --git a/Cargo.toml b/Cargo.toml
index ebe060d..464b811 100644
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -14,6 +14,7 @@ repository = "https://github.com/YGGverse/yggtrackerd"
 clap = { version = "4.5", features = ["derive"] }
 rocket = "0.5"
 librqbit-core = "5.0"
-chrono = "0.4.41"
-url = "2.5"
-urlencoding = "2.1"
\ No newline at end of file
+chrono = { version = "0.4.41", features = ["serde"] }
+url = { version = "2.5", features = ["serde"] }
+urlencoding = "2.1"
+rocket_dyn_templates = { version = "0.2", features = ["tera"] }
diff --git a/src/config.rs b/src/config.rs
index dfb4520..dfd3215 100644
--- a/src/config.rs
+++ b/src/config.rs
@@ -32,6 +32,10 @@ pub struct Config {
     #[arg(long)]
     pub link: Option<Url>,
 
+    /// Optional reference to the [Aquatic](https://github.com/greatest-ape/aquatic) stats page
+    #[arg(long)]
+    pub stats: Option<Url>,
+
     /// Appends following tracker(s) to the magnet links
     #[arg(long)]
     pub tracker: Option<Vec<Url>>,
diff --git a/src/main.rs b/src/main.rs
index 0bea458..31d5ba6 100644
--- a/src/main.rs
+++ b/src/main.rs
@@ -12,16 +12,40 @@ use rocket::{
     State,
     http::Status,
     response::{content::RawXml, status::Custom},
+    serde::Serialize,
 };
+use rocket_dyn_templates::{Template, context};
 use storage::{Order, Sort, Storage};
+use url::Url;
+
+#[derive(Clone, Debug, Serialize)]
+#[serde(crate = "rocket::serde")]
+pub struct Meta {
+    pub canonical: Option<Url>,
+    pub description: Option<String>,
+    pub stats: Option<Url>,
+    pub title: String,
+    pub trackers: Option<Vec<Url>>,
+}
 
 #[get("/")]
-pub fn index() -> &'static str {
-    "Catalog in development, use /rss"
+fn index(storage: &State<Storage>, meta: &State<Meta>) -> Result<Template, Custom<String>> {
+    Ok(Template::render(
+        "index",
+        context! {
+            meta: meta.inner(),
+            torrents: storage
+            .torrents(
+                Some((Sort::Modified, Order::Asc)),
+                Some(storage.default_limit),
+            )
+            .map_err(|e| Custom(Status::InternalServerError, e.to_string()))?
+        },
+    ))
 }
 
 #[get("/rss")]
-pub fn rss(feed: &State<Feed>, storage: &State<Storage>) -> Result<RawXml<String>, Custom<String>> {
+fn rss(feed: &State<Feed>, storage: &State<Storage>) -> Result<RawXml<String>, Custom<String>> {
     let mut b = feed.transaction(1024); // @TODO
     for torrent in storage
         .torrents(
@@ -40,13 +64,14 @@ fn rocket() -> _ {
     use clap::Parser;
     let config = Config::parse();
     let feed = Feed::init(
-        config.title,
-        config.description,
-        config.link,
-        config.tracker.map(|u| u.into_iter().collect()), // make sure it's unique
+        config.title.clone(),
+        config.description.clone(),
+        config.link.clone(),
+        config.tracker.clone().map(|u| u.into_iter().collect()), // make sure it's unique
     );
     let storage = Storage::init(config.storage, config.limit, config.capacity).unwrap(); // @TODO handle
     rocket::build()
+        .attach(Template::fairing())
         .configure(rocket::Config {
             port: config.port,
             address: config.address,
@@ -54,5 +79,12 @@ fn rocket() -> _ {
         })
         .manage(feed)
         .manage(storage)
+        .manage(Meta {
+            canonical: config.link,
+            description: config.description,
+            stats: config.stats,
+            title: config.title,
+            trackers: config.tracker,
+        })
         .mount("/", routes![index, rss])
 }
diff --git a/src/storage.rs b/src/storage.rs
index 61e9317..4826374 100644
--- a/src/storage.rs
+++ b/src/storage.rs
@@ -1,5 +1,6 @@
 use chrono::{DateTime, Utc};
 use librqbit_core::{torrent_metainfo, torrent_metainfo::TorrentMetaV1Owned};
+use rocket::serde::Serialize;
 use std::{
     fs::{self, DirEntry},
     path::PathBuf,
@@ -15,14 +16,18 @@ pub enum Sort {
 pub enum Order {
     #[default]
     Asc,
-    Desc,
+    //Desc,
 }
 
+#[derive(Clone, Debug, Serialize)]
+#[serde(crate = "rocket::serde")]
 pub struct File {
     pub name: Option<String>,
     pub length: u64,
 }
 
+#[derive(Clone, Debug, Serialize)]
+#[serde(crate = "rocket::serde")]
 pub struct Torrent {
     pub announce: Option<String>,
     pub comment: Option<String>,
@@ -171,7 +176,7 @@ impl Storage {
             match sort {
                 Sort::Modified => match order {
                     Order::Asc => b.sort_by(|a, b| a.0.cmp(&b.0)),
-                    Order::Desc => b.sort_by(|a, b| b.0.cmp(&a.0)),
+                    //Order::Desc => b.sort_by(|a, b| b.0.cmp(&a.0)),
                 },
             }
         }
diff --git a/templates/index.html.tera b/templates/index.html.tera
new file mode 100644
index 0000000..b679e02
--- /dev/null
+++ b/templates/index.html.tera
@@ -0,0 +1,9 @@
+{% extends "layout/default" %}
+{% block content %}
+{% for torrent in torrents %}
+<div>
+    <a name="{{ torrent.info_hash }}"></a>
+    <h2>{{ torrent.name }}</h2>
+</div>
+{% endfor %}
+{% endblock content %}
\ No newline at end of file
diff --git a/templates/layout/default.html.tera b/templates/layout/default.html.tera
new file mode 100644
index 0000000..4ab570c
--- /dev/null
+++ b/templates/layout/default.html.tera
@@ -0,0 +1,103 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="UTF-8" />
+        <title>{{ meta.title }}</title>
+        {% if meta.description %}
+            <meta name="description" content="{{ meta.description }}" />
+        {% endif %}
+        <style>
+            * {
+                border: 0;
+                margin: 0;
+                padding: 0;
+                box-sizing: border-box;
+                outline: none;
+            }
+            :focus,
+            :focus-within,
+            :focus-visible,
+            :active,
+            :target,
+            :hover {
+                opacity: 1;
+                transition: opacity .2s ease-in-out;
+            }
+
+            body {
+                background: #282b3c;
+                color: #ccc;
+                font-family: Sans-serif;
+                font-size: 13px;
+            }
+
+            a,
+            a:visited,
+            a:active {
+                color: #96d9a1;
+                text-decoration: none;
+                opacity: .9;
+            }
+
+            h1, h2, h3, h4, h5 {
+                display: inline-block;
+                font-weight: normal;
+            }
+
+            h1 {
+                font-size: 16px;
+            }
+
+            h2 {
+                color: #ccc;
+                font-size: 14px;
+            }
+
+            body > * {
+                position: relative;
+                overflow: hidden;
+                max-width: 748px;
+            }
+
+            header, footer {
+                text-align: center;
+                margin: 16px auto;
+            }
+
+            header a.logo {
+                color: #ccc;
+                font-size: 20px;
+            }
+
+            header a.logo > span {
+                color: #96d9a1;
+            }
+
+            main {
+                margin: 0 auto;
+            }
+
+            main > div {
+                background-color: #34384f;
+                border-radius: 3px;
+                margin: 8px 0;
+                padding: 24px;
+            }
+        </style>
+    </head>
+    <body>
+        <header>
+            <a class="logo" href="/">
+                <span>YGG</span>tracker
+            </a>
+        </header>
+        <main>
+        {% block content %}{% endblock content %}
+        </main>
+        <footer>
+            {% if meta.stats %}<a href="{meta.stats}">Stats</a> |{% endif %}
+            <a href="/rss">RSS</a> |
+            <a href="https://github.com/YGGverse/YGGtracker">GitHub</a>
+        </footer>
+    </body>
+</html>
\ No newline at end of file