diff --git a/src/templates/ApiSwagger.jsx b/src/templates/ApiSwagger.jsx
index ea78f73f..f1ab7026 100644
--- a/src/templates/ApiSwagger.jsx
+++ b/src/templates/ApiSwagger.jsx
@@ -29,9 +29,23 @@ const Method = ({ keyName, value }) => (
             {keyName}
         </h3>
 
-        <p>{value['summary']}</p>
+        <p>{value.summary}</p>
 
-        {value['description'] && <p>{value['description']}</p>}
+        {value.description && <p>{value.description}</p>}
+
+        {value.consumes &&
+            value.consumes.map((item, i) => (
+                <div key={i}>
+                    <code>{item}</code>
+                </div>
+            ))}
+
+        <h4 className={styles.subHeading}>Responses</h4>
+        {Object.entries(value.responses).map(([key, value]) => (
+            <div key={key}>
+                <code>{key}</code> {value.description}
+            </div>
+        ))}
     </div>
 )
 
diff --git a/src/templates/ApiSwagger.module.scss b/src/templates/ApiSwagger.module.scss
index a5884f82..647ef031 100644
--- a/src/templates/ApiSwagger.module.scss
+++ b/src/templates/ApiSwagger.module.scss
@@ -4,13 +4,20 @@
     font-size: $font-size-h2;
     border-bottom: 1px solid $brand-grey-lighter;
     padding-bottom: $spacer / 2;
-    margin-bottom: $spacer / 2;
+    margin-top: $spacer * 2;
+    margin-bottom: $spacer;
+
+    code {
+        // stylelint-disable-next-line
+        background: none !important;
+    }
 }
 
 .pathMethod {
     font-size: $font-size-base;
     font-family: $font-family-monospace;
     margin-bottom: $spacer / 4;
+    margin-top: 0;
     display: inline-block;
     padding: $spacer / 8 $spacer / 4;
     border-radius: $border-radius;
@@ -33,6 +40,12 @@
 }
 
 .method {
-    padding-top: $spacer / 4;
-    padding-bottom: $spacer / 4;
+    padding: $spacer / 2;
+    border: 1px solid $brand-grey-lighter;
+    margin-bottom: $spacer;
+    border-radius: $border-radius;
+}
+
+.subHeading {
+    font-size: $font-size-base;
 }