Inline Code | DocsKit

Install

$ pnpm dlx shadcn@latest add https://docskit.codehike.org/r/inline

Add the DocsKitInlineCode component so that it's available in your MDX files:

@/components/docskit.tsx

+
import { DocsKitInlineCode } from "./code.inline"

export function addDocsKit(components: MDXComponents) {
  return {
    ...components,
    DocsKitCode,
+
    DocsKitInlineCode,
  }
}

ExampleTry it in the Playground

content.mdx

This is a variable in JavaScript: _`var x = 10`_.

In CSS it looks like this: _css`a { --x: 10 }`_.

And in Pascal it's _pascal`x := 10`_.

preview

This is a variable in JavaScript: var x = 10.

In CSS it looks like this: a { --x: 10 }.

And in Pascal it's x := 10.