diff --git a/scripts/generate.py b/scripts/generate.py
index d284193..22651ae 100644
--- a/scripts/generate.py
+++ b/scripts/generate.py
@@ -393,6 +393,11 @@ def render(headline, doc, headlineLevel):
     else:
         todo_state = "done"
 
+    tag_list = []
+    for tag in headline.shallow_tags:
+        tag_list.append(f'<span class="tag">{html.escape(tag)}</span>')
+    tags = f'<span class="tags">{"".join(tag_list)}</span>'
+
     # display_state = 'collapsed'
     # if headlineLevel < MIN_HIDDEN_HEADLINE_LEVEL:
     #     display_state = 'expanded'
@@ -405,6 +410,7 @@ def render(headline, doc, headlineLevel):
     <a href=\"javascript:toggle_expand('{html.escape(headline.id)}')\">
       {render_inline(headline.title, render_tag)}
     </a>
+    {tags}
   </h1>
   <div class='contents'>
     {''.join(content)}
diff --git a/static/style.css b/static/style.css
index 24cd16a..ae7d053 100644
--- a/static/style.css
+++ b/static/style.css
@@ -69,6 +69,22 @@ h1.title .state {
 h1.title .state.state-TODO {
     background-color: rgba(255,0,0,0.5);
 }
+h1.title .state.state-DONE {
+    background-color: rgba(0,255,0,0.25);
+}
+
+h1.title .tags {
+    float: right;
+}
+h1.title .tags .tag {
+    font-size: 50%;
+    vertical-align: middle;
+    /* background-color: rgba(255,255,255,0.3); */
+    background-color: rgba(0,0,0,0.1);
+    padding: 4px;
+    margin-left: 2px;
+    border-radius: 5px;
+}
 
 /* Lists */
 li .tag {