diff --git a/app/assets/stylesheets/design_system/_hljs.scss b/app/assets/stylesheets/design_system/_hljs.scss
index cc9dc0ef..d2e84b77 100644
--- a/app/assets/stylesheets/design_system/_hljs.scss
+++ b/app/assets/stylesheets/design_system/_hljs.scss
@@ -55,7 +55,7 @@
 .hljs-quote,
 .hljs-template-tag {
   /* var(--highlight-namespace) */
-  color: #b75501;
+  color: #b25301;
 }
 
 .hljs-selector-class {
@@ -84,7 +84,7 @@
 .hljs-title,
 .hljs-literal {
   /* var(--highlight-literal) */
-  color: #b75501;
+  color: #b25301;
 }
 
 .hljs-bullet,
diff --git a/app/assets/stylesheets/design_system/govuk.scss b/app/assets/stylesheets/design_system/govuk.scss
index f9a5a718..aff613c6 100644
--- a/app/assets/stylesheets/design_system/govuk.scss
+++ b/app/assets/stylesheets/design_system/govuk.scss
@@ -88,6 +88,11 @@
   overflow-x: auto;
   overflow-y: auto;
   padding: 0.5rem;
+
+  &:focus {
+    outline: 3px solid #fd0;
+    outline-offset: 2px;
+  }
 }
 
 .app-example__code pre {
diff --git a/app/assets/stylesheets/design_system/nhsuk.scss b/app/assets/stylesheets/design_system/nhsuk.scss
index 423307a5..ee1ce76c 100644
--- a/app/assets/stylesheets/design_system/nhsuk.scss
+++ b/app/assets/stylesheets/design_system/nhsuk.scss
@@ -28,6 +28,11 @@
   overflow-x: auto;
   overflow-y: auto;
   padding: 0.5rem;
+
+  &:focus {
+    outline: 3px solid #fd0;
+    outline-offset: 2px;
+  }
 }
 
 .app-example__code pre {
@@ -36,7 +41,7 @@
 }
 
 .app-example__code pre code.hljs {
-  background: transparent;
+  background: #f0f4f5;
 }
 
 .app-example__copy-button {
diff --git a/lib/design_system/generic/builders/code.rb b/lib/design_system/generic/builders/code.rb
index 71f74d5b..572b3fed 100644
--- a/lib/design_system/generic/builders/code.rb
+++ b/lib/design_system/generic/builders/code.rb
@@ -9,7 +9,7 @@ def render_code(code, language)
           content_tag(:div, class: 'app-example__code', data: { controller: 'ds--clipboard' }) do
             content_tag(:button, 'Copy', class: 'app-example__copy-button',
                                          data: { action: 'click->ds--clipboard#copy', 'ds--clipboard-target': 'buttonText' }) +
-              content_tag(:div, class: 'app-example__scroll') do
+              content_tag(:div, class: 'app-example__scroll', tabindex: 0) do
                 content_tag(:pre, data: { 'ds--clipboard-target': 'source' }) do
                   content_tag(:code, code, data: { controller: 'ds--code-highlight' },
                                            class: "hljs language-#{language}")