diff --git a/.changeset/sweet-squids-design.md b/.changeset/sweet-squids-design.md
new file mode 100644
index 0000000000..3b6358d7f1
--- /dev/null
+++ b/.changeset/sweet-squids-design.md
@@ -0,0 +1,6 @@
+---
+"@marigold/docs": patch
+"@marigold/theme-docs": patch
+---
+
+docs: adjust font size of `code` in `<SectionMessage>` and make them less distracting
diff --git a/docs/ui/mdx.tsx b/docs/ui/mdx.tsx
index e98161162a..c154d31cdb 100644
--- a/docs/ui/mdx.tsx
+++ b/docs/ui/mdx.tsx
@@ -129,7 +129,7 @@ const typography = {
   ),
   code: (props: HTMLAttributes<HTMLElement>) => (
     <code
-      className="my-0 inline-grid rounded bg-black/10 px-1 py-0.5 font-mono text-sm before:content-none after:content-none"
+      className="my-0 inline-grid rounded bg-black/5 px-1 py-0.5 font-mono text-sm before:content-none after:content-none"
       {...props}
     />
   ),
diff --git a/themes/theme-docs/src/components/SectionMessage.styles.ts b/themes/theme-docs/src/components/SectionMessage.styles.ts
index 378c40fa4d..5738e3110d 100644
--- a/themes/theme-docs/src/components/SectionMessage.styles.ts
+++ b/themes/theme-docs/src/components/SectionMessage.styles.ts
@@ -17,5 +17,5 @@ export const SectionMessage: ThemeComponent<'SectionMessage'> = {
   ),
   icon: cva('size-6'),
   title: cva('mb-1 font-bold leading-none tracking-tight'),
-  content: cva('text-sm [&_p]:leading-relaxed'),
+  content: cva('text-sm [&_p]:leading-relaxed [&_code]:text-xs'),
 };