<code>
The <code> element represents a fragment of computer code. This includes variable names, function names, code snippets, file names, and any text that represents computer-readable content. It is typically rendered in a monospace font.
This page was last updated on 2025-11-27
Syntax
<code>code text</code>
Attributes
- class - CSS class name (useful for syntax highlighting)
- id - Unique identifier
- style - Inline CSS styles
- title - Advisory information
Examples
Inline code reference:
<p>Use the <code>getElementById()</code> method to select elements.</p>
Variable name:
<p>Set the <code>userName</code> variable before calling the function.</p>
File name:
<p>Edit the <code>config.json</code> file in the root directory.</p>
Code block with pre:
<pre><code>
function add(a, b) {
return a + b;
}
</code></pre>
With language class:
<pre><code class="language-javascript">
const message = "Hello";
console.log(message);
</code></pre>
When to Use
Use <code> for any text that represents computer code, including function names, variable names, element names, file names, CSS properties, command-line text, and code snippets. The element conveys semantic meaning that this text is code rather than regular prose.
For multi-line code blocks, wrap the <code> element inside a <pre> element to preserve formatting and whitespace. Many syntax highlighting libraries look for <code> elements with language-specific classes to apply color coding.
