diff --git a/petition/templates/base.html b/petition/templates/base.html
new file mode 100644
index 0000000..1341bed
--- /dev/null
+++ b/petition/templates/base.html
@@ -0,0 +1,17 @@
+<!doctype html>
+
+<html lang="fr">
+  <head>
+    <meta charset="utf-8">
+
+    <title>Pétition — réparons la sonnette</title>
+    <meta name="author" content="Arcoloc.eu">
+
+    <!-- <link rel="stylesheet" href="static/style.css"> -->
+  </head>
+
+  <body>
+    {% block content %}
+    {% endblock content %}
+  </body>
+</html>
diff --git a/petition/templates/petition/petition.html b/petition/templates/petition/petition.html
new file mode 100644
index 0000000..0187fb2
--- /dev/null
+++ b/petition/templates/petition/petition.html
@@ -0,0 +1,39 @@
+{% extends base.html %}
+
+{% block content %}
+<h1>Pétition — Réparons cette sonnette !</h1>
+
+<h2>Signez</h2>
+
+<p>
+  Vous voulez que la sonnette de l'arcoloc soit enfin réparée ? Signez ici !
+</p>
+
+<form method="post">
+  {% csrf_token %}
+  {{ form }}
+  <input type="submit" value="Faire entendre votre droit à une sonnette !" />
+</form>
+
+</h2>Gens ayant déjà signé</h2>
+
+{% if not signers %}
+
+<p>Personne n'a signé. C'est pas comme ça que ça sera réparé, vous savez ?</p>
+
+{% else %}
+
+<p>
+Plein de gens (c'est à dire, {{ num_signers }}) ont déjà signé. Voici leurs
+noms :
+</p>
+
+<ul>
+  {% for signer in signers %}
+  <li>{{ signer.name }}</li>
+  {% endfor %}
+</ul>
+
+{% endif %}
+
+{% endblock content %}
