diff --git a/apps/docs/src/common/pages/content-style-guide.tsx b/apps/docs/src/common/pages/content-style-guide.tsx
index 66b62520..10635c0a 100644
--- a/apps/docs/src/common/pages/content-style-guide.tsx
+++ b/apps/docs/src/common/pages/content-style-guide.tsx
@@ -22,6 +22,10 @@ export const menu = (
       {
         href: '/content-style-guide/designing-for-limited-english',
         text: 'Designing for users with limited English'
+      },
+      {
+        href: '/content-style-guide/voice-and-tone',
+        text: 'Voice and tone'
       }
     ]} />
   </Fragment>
diff --git a/apps/docs/src/common/pages/content-style-guide/designing-for-limited-english.tsx b/apps/docs/src/common/pages/content-style-guide/designing-for-limited-english.tsx
index 2e2a7f88..7e8655a1 100644
--- a/apps/docs/src/common/pages/content-style-guide/designing-for-limited-english.tsx
+++ b/apps/docs/src/common/pages/content-style-guide/designing-for-limited-english.tsx
@@ -2,11 +2,11 @@ import { FC, createElement as h } from 'react';
 import { Helmet } from 'react-helmet-async';
 import { PageProps } from '@not-govuk/app-composer';
 import { A } from '@not-govuk/components';
-import { menu } from '../accessibility'
+import { menu } from '../content-style-guide'
 
 export const title = 'Limited English';
 const description = 'Designing for people with limited English';
-export const section = 'Accessibility';
+export const section = 'Content style guide';
 
 const biometricsSign = require('../../../../assets/images/content-style-guide/Biometrics sign.png');
 
diff --git a/apps/docs/src/common/pages/content-style-guide/voice-and-tone.html b/apps/docs/src/common/pages/content-style-guide/voice-and-tone.tsx
similarity index 89%
rename from apps/docs/src/common/pages/content-style-guide/voice-and-tone.html
rename to apps/docs/src/common/pages/content-style-guide/voice-and-tone.tsx
index 1b3b0f62..4e2a6a90 100644
--- a/apps/docs/src/common/pages/content-style-guide/voice-and-tone.html
+++ b/apps/docs/src/common/pages/content-style-guide/voice-and-tone.tsx
@@ -2,13 +2,11 @@
 import { Helmet } from 'react-helmet-async';
 import { PageProps } from '@not-govuk/app-composer';
 import { A } from '@not-govuk/components';
-import { menu } from '../accessibility'
+import { menu } from '../content-style-guide'
 
-export const title = 'Limited English';
-const description = 'Designing for people with limited English';
-export const section = 'Accessibility';
-
-const biometricsSign = require('../../../../assets/images/content-style-guide/Biometrics sign.png');
+export const title = 'Voice and tone';
+const description = 'Voice and tone';
+export const section = 'Content style guide';
 
 const Page: FC<PageProps> = ({ location }) => (
   <div className="govuk-grid-row">
@@ -24,8 +22,8 @@
     </div>
     <div className="govuk-grid-column-three-quarters">
       <h1>
-        <span className="caption">Content style guide</span>
-          Voice and tone
+        <span className="caption">{section}</span>
+          {title}
       </h1>
       <h2 id="home-office-voice">Home Office voice</h2>
       <p>Our voice should be consistent across all our products and services. It is who we are and how we want others to see us.</p>