<h1> - <h6>

Syntax

<h1>Main Heading</h1>
<h2>Subheading</h2>
<h3>Sub-subheading</h3>

Examples

<h1>How to Bake Bread</h1>
<h2>Ingredients</h2>
<h2>Instructions</h2>
<h3>Preparing the Dough</h3>
<h3>Baking</h3>

<h1>Codectionary Blog</h1>
<article>
  <h2>Understanding Closures in JavaScript</h2>
  <h3>What is a Closure?</h3>
  <p>A closure gives a function access to its outer scope...</p>
  <h3>Common Use Cases</h3>
</article>

<h1 style="font-size: 2.5rem; color: #1a1a1a; border-bottom: 3px solid #3b82f6; padding-bottom: 8px;">Welcome</h1>
<h2 style="font-size: 1.5rem; color: #4b5563;">Getting Started</h2>

Best practices

• Use exactly one <h1> per page that describes the main content
• Never skip heading levels (e.g., going from <h2> straight to <h4>) as it breaks the document outline
• Choose heading levels based on document structure, not visual size — use CSS for styling instead
• Keep heading text concise and descriptive so it makes sense out of context (screen reader users often navigate by headings alone)
• Avoid using headings purely for visual emphasis on text that is not actually a section title

Browser compatibility

Related HTML documentation

Specifications & further reading

• HTML Living Standard