diff --git a/.changeset/pink-owls-refuse.md b/.changeset/pink-owls-refuse.md
new file mode 100644
index 00000000000..6f582186ab2
--- /dev/null
+++ b/.changeset/pink-owls-refuse.md
@@ -0,0 +1,5 @@
+---
+'@lighting-beetle/lighter-styleguide': patch
+---
+
+Nicer code examples with unescaped HTML attribute values
diff --git a/packages/styleguide/src/components/Preview/CodeExample.js b/packages/styleguide/src/components/Preview/CodeExample.js
index f4e2dcd4b02..2ddb0167a03 100644
--- a/packages/styleguide/src/components/Preview/CodeExample.js
+++ b/packages/styleguide/src/components/Preview/CodeExample.js
@@ -176,7 +176,7 @@ export default class CodeExample extends React.Component {
         codeToShow =
           typeof children === 'string'
             ? unescape(children)
-            : pretty(renderToStaticMarkup(children));
+            : unescape(pretty(renderToStaticMarkup(children)), { ocd: true });
         break;
       case 'jsx':
         codeToShow = getJSXAsStringFromMarkup(children, codeJSXOptions);