diff --git a/src/www/pages/index.njk b/src/www/pages/index.njk
index 1c303c0a7..4c4532d54 100644
--- a/src/www/pages/index.njk
+++ b/src/www/pages/index.njk
@@ -36,61 +36,57 @@
 <div class="wmnds-grid wmnds-grid--align-stretch wmnds-grid--spacing-sm-2-xsm wmnds-grid--spacing-lg-4-xsm wmnds-m-t-md">
   {# User research #}
   <div class="wmnds-col-1 wmnds-col-sm-1-2 wmnds-col-lg-1-4 wmnds-p-b-xsm">
-    {{
-      wmndsContentTilesNormal({
-        classModifiers: 'wmnds-content-tile--with-one-link',
-        title: "User research",
-        copy: "<p>Start with user needs to make sure you're building the right thing</p>",
-        smallTitle: true,
-        readMore: true,
-        link: '/user-research/',
-        linkText: 'Read more about user research',
-        linkTitle: 'User research'
+     {{
+      wmndsContentCard({
+        clickable: true,
+        link: "/user-research/",
+        linkTitle: "User research",
+        html: "<div class=\"wmnds-p-sm\">
+           <h3>User research</h3>
+         <p>Start with user needs to build the right thing</p>
+       </div>"
       })
     }}
   </div>
   {# Styles #}
   <div class="wmnds-col-1 wmnds-col-sm-1-2 wmnds-col-lg-1-4 wmnds-p-b-xsm">
-    {{
-      wmndsContentTilesNormal({
-        classModifiers: 'wmnds-content-tile--with-one-link',
-        title: "Styles",
-        copy: "<p>Make your service look and feel like WMN: colours, icons, typography and utility classes</p>",
-        smallTitle: true,
-        readMore: true,
-        link: '/styles/',
-        linkText: 'Read more about styles',
-        linkTitle: 'Styles'
+      {{
+      wmndsContentCard({
+        clickable: true,
+        link: "/styles/",
+        linkTitle: "Styles",
+        html: "<div class=\"wmnds-p-sm\">
+           <h3>Styles</h3>
+         <p>Make your service look and feel like West Midlands Network</p>
+       </div>"
       })
     }}
   </div>
   {# Components #}
   <div class="wmnds-col-1 wmnds-col-sm-1-2 wmnds-col-lg-1-4 wmnds-p-b-xsm">
-    {{
-      wmndsContentTilesNormal({
-        classModifiers: 'wmnds-content-tile--with-one-link',
-        title: "Components",
-        copy: "<p>Reusable parts of the user interface: content, map and form elements; buttons and messages</p>",
-        smallTitle: true,
-        readMore: true,
-        link: '/components/',
-        linkText: 'Read more about components',
-        linkTitle: 'Components'
+        {{
+      wmndsContentCard({
+        clickable: true,
+        link: "/components/",
+        linkTitle: "Components",
+        html: "<div class=\"wmnds-p-sm\">
+           <h3>Components</h3>
+         <p>Reusable parts of the user interface</p>
+       </div>"
       })
     }}
   </div>
   {# Patterns #}
   <div class="wmnds-col-1 wmnds-col-sm-1-2 wmnds-col-lg-1-4 wmnds-p-b-xsm">
-    {{
-      wmndsContentTilesNormal({
-        classModifiers: 'wmnds-content-tile--with-one-link',
-        title: "Patterns",
-        copy: "<p>Commonly used sets of components</p>",
-        smallTitle: true,
-        readMore: true,
-        link: '/patterns/',
-        linkText: 'Read more about patterns',
-        linkTitle: 'Patterns'
+        {{
+      wmndsContentCard({
+        clickable: true,
+        link: "/patterns/",
+        linkTitle: "Patterns",
+        html: "<div class=\"wmnds-p-sm\">
+           <h3>Patterns</h3>
+         <p>Commonly used sets of components</p>
+       </div>"
       })
     }}
   </div>