diff --git a/catalog.html.j2 b/catalog.html.j2
new file mode 100644
index 0000000..1a84fb6
--- /dev/null
+++ b/catalog.html.j2
@@ -0,0 +1,34 @@
+
+
+
+
+
+ Cliget Catalog
+
+
+
+{{get_context()|length}} entries
+
+
+| name | repo | description |
|---|
+
+
+{% for k,o in get_context().items()%}
+
+|
+
+{%if "website" in o%}{{k}}{%else%}{{k}}{%endif%}
+ |
+
+{%if "github" in o%}x{%else%} {%endif%}
+ |
+{{o.desc}} |
+
+{% endfor %}
+
+
+{{get_context()|length}} entries
+
+
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000..b826205
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,40 @@
+:root {
+ --accent-bg: #F5F7FF;
+ --border: #D8DAE1;
+ --main-foreground: #5b4636;
+ --main-background: #f4f4f4;
+}
+
+body{max-width:80ch;padding:2ch;margin:auto;
+ color:var(--main-foreground);
+ background-color:var(--main-background);
+}
+
+a:link{text-decoration:none}
+
+/* Format tables */
+table {
+ border-collapse: collapse;
+ width: 100%
+}
+
+td,
+th {
+ border: 1px solid var(--border);
+ text-align: left;
+}
+
+th {
+ background: var(--accent-bg);
+ font-weight: bold;
+ text-align: center;
+}
+
+table td:nth-child(2) {
+ text-align: center;
+}
+
+tr:nth-child(even) {
+ /* Set every other cell slightly darker. Improves readability. */
+ background: var(--accent-bg);
+}