diff --git a/static/api.css b/static/api.css
index 7fed9f4..a83dd0f 100644
--- a/static/api.css
+++ b/static/api.css
@@ -11,6 +11,14 @@ div#help {
     max-width: 1200px;
 }
 
+div.json {
+    font-family: monospace;
+}
+
+div.indent {
+    width: 4em;
+}
+
 span.code {
     font-family: monospace;
 }
diff --git a/templates/api.mako b/templates/api.mako
index a5157f7..864a329 100644
--- a/templates/api.mako
+++ b/templates/api.mako
@@ -1,7 +1,29 @@
-<%def name="walk_json(obj)">
-    <!-- TODO -->
-    ${obj | h}
-</%def>
+<%def name="do_indent(size)">
+    % for i in xrange(size):
+        <div class="indent"></div>
+    % endfor
+</%def>\
+<%def name="walk_json(obj, indent=0)">
+    % if isinstance(obj, dict):
+        {
+        % for key, value in obj.iteritems():
+            ${do_indent(indent + 1)}
+            "${key | h}": ${walk_json(key, indent + 1)}${"," if not loop.last else ""}
+        % endfor
+        ${do_indent(indent)}
+        }
+    % elif isinstance(obj, list):
+        [
+        % for member in obj:
+            ${do_indent(indent + 1)}
+            ${walk_json(member, indent + 1)}${"," if not loop.last else ""}
+        % endfor
+        ${do_indent(indent)}
+        ]
+    % else:
+        ${obj | h}
+    % endif
+</%def>\
 <!DOCTYPE html>
 <html lang="en">
     <head>
@@ -276,7 +298,9 @@
         % if result:
             <div id="result">
                 <p>You are using <span class="code">jsonfm</span> output mode, which renders JSON data as a formatted HTML document. This is intended for testing and debugging only.</p>
-                <pre>${walk_json(result)}</pre>
+                <div class="json">
+                    ${walk_json(result)}
+                </div>
             </div>
         % endif
     </body>
