diff --git a/res/templates/notif.html b/res/templates/notif.html
new file mode 100644
index 000000000..aa6ed1e06
--- /dev/null
+++ b/res/templates/notif.html
@@ -0,0 +1,32 @@
+<div class="notif">
+    <div>
+        {% for message in notif.messages %}
+            <div class="message {% if message.is_historical %}historical{% endif %}">
+                {% if message.sender_avatar_url %}
+                    <img class="sender_avatar" src="{{ message.sender_avatar_url|mxc_to_http(48,48) }}"  />
+                {% else %}
+                    {% if message.sender_hash % 3 == 0 %}
+                        <img class="sender_avatar" src="https://vector.im/beta/img/76cfa6.png"  />
+                    {% elif message.sender_hash % 3 == 1 %}
+                        <img class="sender_avatar" src="https://vector.im/beta/img/50e2c2.png"  />
+                    {% else %}
+                        <img class="sender_avatar" src="https://vector.im/beta/img/f4c371.png"  />
+                    {% endif %}
+                    <img class="sender_avatar" src="{{ message.sender_avatar_url }}"  />
+                {% endif %}
+                <div class="sender_name">{{ message.sender_name }}</div>
+                <div class="message_time">{{ message.ts|format_ts("%H:%M") }}</div>
+                <div class="message_body">
+                    {% if message.format == "org.matrix.custom.html" %}
+                        {{ message.body_text_html }}
+                    {% else %}
+                        {{ message.body_text_plain }}
+                    {% endif %}
+                </div>
+            </div>
+        {% endfor %}
+    </div>
+    <div class="notif_link">
+        <a href="{{ link }}">View in Vector</a>
+    </div>
+</div>