Skip to content
DisplayBrowse display components
ComponentsDisplayNew in 0.2

Code & Code block

Inline code and full code blocks with monospace, sunken background, and bordered container.

Live preview

Add @plugin "@lumora-design/core" to your CSS.

@import "tailwindcss";
@plugin "@lumora-design/core";

Usage

Adapters:React stableVue stable
index.html
<code class="lm-code">npm install</code>
<pre class="lm-code-block"><code>const x = 1;</code></pre>

CSS classes (2)

ClassDescription
lm-codeInline code span
lm-code-blockMulti-line code container

Accessibility

  • Use semantic <code> and <pre><code> elements.

Spotted something wrong? Edit this entry on GitHub.