diff --git a/app/assets/stylesheets/components/letter.scss b/app/assets/stylesheets/components/letter.scss
new file mode 100644
index 000000000..825968d46
--- /dev/null
+++ b/app/assets/stylesheets/components/letter.scss
@@ -0,0 +1,6 @@
+.letter {
+  font-family: Helvetica, Arial, sans-serif;
+  box-shadow: 0 2px 2px rgba($text-colour, 0.4);
+  outline: 5px solid rgba($text-colour, 0.1);
+  padding: 20px;
+}
diff --git a/app/templates/components/letter.html b/app/templates/components/letter.html
new file mode 100644
index 000000000..8440ba31b
--- /dev/null
+++ b/app/templates/components/letter.html
@@ -0,0 +1,7 @@
+{% macro letter(
+  body
+) %}
+  <div class="letter">
+    {{ body }}
+  </div>
+{% endmacro %}