diff --git a/templates/index.html b/templates/index.html
index 29270e3..e6d5be7 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -90,8 +90,11 @@
 <body>
 
   <div class="container-fluid mt-2">
-    <p><a href="/tools">&larr; personal tools</a></p>
     <h1>Agenda</h1>
+    <p>
+      <a href="/tools">&larr; personal tools</a> |
+      <a href="{{ url_for("travel_page") }}">travel</a>
+    </p>
 
     <ul>
     <li>Today is {{now.strftime("%A, %-d %b %Y")}}</li>
diff --git a/templates/travel.html b/templates/travel.html
new file mode 100644
index 0000000..81d0719
--- /dev/null
+++ b/templates/travel.html
@@ -0,0 +1,95 @@
+{% extends "base.html" %}
+
+{% block travel %}
+{% endblock %}
+
+{% macro display_datetime(dt) %}{{ dt.strftime("%a, %d, %b %Y %H:%M %z") }}{% endmacro %}
+{% macro display_time(dt) %}{{ dt.strftime("%H:%M %z") }}{% endmacro %}
+
+{% block style %}
+<style>
+.grid-container {
+  display: grid;
+  grid-template-columns: repeat(7, auto); /* 7 columns for each piece of information */
+  gap: 10px;
+  justify-content: start;
+}
+
+.train-grid-container {
+  display: grid;
+  grid-template-columns: repeat(6, auto); /* 7 columns for each piece of information */
+  gap: 10px;
+  justify-content: start;
+}
+
+
+
+.grid-item {
+  /* Additional styling for grid items can go here */
+}
+</style>
+{% endblock %}
+
+{% block content %}
+
+<div class="container-fluid mt-2">
+
+  <h1>Travel</h1>
+
+  <p><a href="{{ url_for("index") }}">&larr; back to agenda</a></p>
+
+  <h3>flights</h3>
+
+  <div class="grid-container">
+      <div class="grid-item text-end">date</div>
+      <div class="grid-item">route</div>
+      <div class="grid-item">take-off</div>
+      <div class="grid-item">land</div>
+      <div class="grid-item">duration</div>
+      <div class="grid-item">flight</div>
+      <div class="grid-item">reference</div>
+
+    {% for item in flights | sort(attribute="depart") if item.arrive %}
+      <div class="grid-item text-end">{{ item.depart.strftime("%a, %d %b %Y") }}</div>
+      <div class="grid-item">{{ item.from }} &rarr; {{ item.to }}</div>
+      <div class="grid-item">{{ item.depart.strftime("%H:%M") }}</div>
+      <div class="grid-item">
+        {% if item.arrive %}
+          {{ item.arrive.strftime("%H:%M") }}
+          {% if item.arrive.date() != item.depart.date() %}+1 day{% endif %}
+        {% endif %}
+      </div>
+      <div class="grid-item">{{ item.duration }}</div>
+      <div class="grid-item">{{ item.airline }}{{ item.flight_number }}</div>
+      <div class="grid-item">{{ item.booking_reference }}</div>
+    {% endfor %}
+  </div>
+
+  <h3 class="mt-4">trains</h3>
+
+  <div class="train-grid-container">
+      <div class="grid-item text-end">date</div>
+      <div class="grid-item">route</div>
+      <div class="grid-item">depart</div>
+      <div class="grid-item">arrive</div>
+      <div class="grid-item">operator</div>
+      <div class="grid-item">reference</div>
+
+    {% for item in trains | sort(attribute="depart") if item.arrive %}
+      <div class="grid-item text-end">{{ item.depart.strftime("%a, %d %b %Y") }}</div>
+      <div class="grid-item">{{ item.from }} &rarr; {{ item.to }}</div>
+      <div class="grid-item">{{ item.depart.strftime("%H:%M") }}</div>
+      <div class="grid-item">
+        {% if item.arrive %}
+          {{ item.arrive.strftime("%H:%M") }}
+          {% if item.arrive.date() != item.depart.date() %}+1 day{% endif %}
+        {% endif %}
+      </div>
+      <div class="grid-item">{{ item.operator }}</div>
+      <div class="grid-item">{{ item.booking_reference }}</div>
+    {% endfor %}
+  </div>
+
+</div>
+
+{% endblock %}
diff --git a/web_view.py b/web_view.py
index d7cbad3..e9848c6 100755
--- a/web_view.py
+++ b/web_view.py
@@ -12,6 +12,7 @@ import werkzeug
 import werkzeug.debug.tbtools
 
 import agenda.data
+import agenda.travel
 
 app = flask.Flask(__name__)
 app.debug = False
@@ -53,5 +54,20 @@ async def index() -> str:
     return flask.render_template("index.html", today=now.date(), **data)
 
 
+@app.route("/travel")
+def travel_page() -> str:
+    """Page showing a list of upcoming travel."""
+    now = datetime.now()
+
+    config = agenda.data.get_config()
+    data_dir = config["data"]["personal-data"]
+    flights = agenda.travel.parse_yaml("flights", data_dir)
+    trains = agenda.travel.parse_yaml("trains", data_dir)
+
+    return flask.render_template(
+        "travel.html", today=now.date(), flights=flights, trains=trains
+    )
+
+
 if __name__ == "__main__":
     app.run(host="0.0.0.0")
