TL
Tool Lab
💰Donate
💰Donate

HTML Tags Reference

Browse all HTML5 tags with descriptions and usage examples.

93 tags

TagDescriptionExample
<!DOCTYPE>Defines the document type<!DOCTYPE html>
<html>Root element of an HTML page<html lang="en">
<head>Container for metadata<head>...</head>
<title>Defines the document title shown in browser tab<title>Page Title</title>
<body>Contains the visible page content<body>...</body>
<meta>Defines metadata about the document<meta charset="UTF-8">
<link>Links to external resources (CSS, icons)<link rel="stylesheet" href="style.css">
<script>Embeds or references JavaScript<script src="app.js"></script>
<style>Embeds CSS styles<style>body { margin: 0; }</style>
<base>Base URL for all relative URLs in the page<base href="https://example.com/">
<h1>–<h6>Heading levels 1 through 6<h1>Page Title</h1>
<p>Paragraph<p>Paragraph text.</p>
<br>Line breakLine one<br>Line two
<hr>Thematic break (horizontal rule)<hr>
<pre>Preformatted text (preserves whitespace)<pre> code here </pre>
<blockquote>Long block quotation from another source<blockquote cite="url">Quote</blockquote>
<q>Short inline quotation<q>Short quote</q>
<abbr>Abbreviation or acronym<abbr title="World Health Organization">WHO</abbr>
<address>Contact information for the article or page<address>Email: contact@example.com</address>
<cite>Title of a cited creative work<cite>Hamlet</cite>
<code>Inline code fragment<code>console.log()</code>
<dfn>Term being defined<dfn>HTML</dfn> is a markup language.
<kbd>Keyboard inputPress <kbd>Ctrl+C</kbd>
<samp>Sample output from a program<samp>Error 404</samp>
<var>Variable in math or programming<var>x</var> = 5
<sub>Subscript textH<sub>2</sub>O
<sup>Superscript textE = mc<sup>2</sup>
<mark>Highlighted/marked text<mark>important</mark>
<del>Deleted text<del>old text</del>
<ins>Inserted text<ins>new text</ins>
<small>Small print or side comments<small>Terms apply</small>
<strong>Strong importance (bold)<strong>Important</strong>
<em>Emphasized text (italic)<em>emphasis</em>
<b>Bold text (stylistic, no extra importance)<b>bold</b>
<i>Italic text (stylistic, or technical terms)<i>italic</i>
<u>Underlined text<u>underline</u>
<s>Strikethrough text (no longer accurate)<s>old price</s>
<span>Generic inline container for styling<span class="highlight">text</span>
<ul>Unordered list<ul><li>Item</li></ul>
<ol>Ordered (numbered) list<ol><li>Step 1</li></ol>
<li>List item (in ul or ol)<li>List item</li>
<dl>Description list<dl><dt>Term</dt><dd>Definition</dd></dl>
<dt>Term in a description list<dt>HTML</dt>
<dd>Description in a description list<dd>HyperText Markup Language</dd>
<a>Hyperlink<a href="https://example.com">Link</a>
<nav>Navigation links section<nav>...</nav>
<header>Introductory content or navigation<header><h1>Site Title</h1></header>
<footer>Footer for a section or page<footer>© 2025</footer>
<main>Main content of the document<main>...</main>
<article>Self-contained composition (blog post, news)<article>...</article>
<section>Thematic grouping of content<section>...</section>
<aside>Content tangentially related to main content<aside>Sidebar</aside>
<div>Generic block-level container<div class="card">...</div>
<details>Disclosure widget (expandable)<details><summary>More</summary>...</details>
<summary>Summary/caption for a details element<summary>Show more</summary>
<dialog>Dialog box or window<dialog open>Content</dialog>
<img>Embeds an image<img src="photo.jpg" alt="Description">
<audio>Embeds audio content<audio src="sound.mp3" controls></audio>
<video>Embeds video content<video src="movie.mp4" controls></video>
<source>Media source for audio/video/picture<source src="video.webm" type="video/webm">
<track>Text tracks for video/audio (subtitles)<track kind="subtitles" src="sub.vtt">
<picture>Container for multiple image sources<picture><source srcset="img.webp"><img src="img.jpg"></picture>
<figure>Self-contained content with optional caption<figure><img src="img.jpg"><figcaption>Caption</figcaption></figure>
<figcaption>Caption for a figure element<figcaption>Image caption</figcaption>
<canvas>Drawing surface for JavaScript graphics<canvas id="myCanvas" width="200" height="100"></canvas>
<svg>Inline SVG vector graphics<svg viewBox="0 0 100 100"><circle cx="50" cy="50" r="40"/></svg>
<iframe>Embeds another HTML page<iframe src="https://example.com"></iframe>
<embed>Embeds external content (plugin)<embed src="file.pdf" type="application/pdf">
<object>Embeds external resource (object)<object data="file.pdf" type="application/pdf"></object>
<table>Table<table><tr><td>Cell</td></tr></table>
<thead>Header rows of a table<thead><tr><th>Col</th></tr></thead>
<tbody>Body rows of a table<tbody>...</tbody>
<tfoot>Footer rows of a table<tfoot>...</tfoot>
<tr>Table row<tr><td>Cell 1</td><td>Cell 2</td></tr>
<th>Header cell<th scope="col">Name</th>
<td>Data cell<td>Content</td>
<caption>Table caption<caption>Sales Data 2025</caption>
<colgroup>Group of table columns<colgroup><col span="2"></colgroup>
<col>Table column properties<col style="width: 50%">
<form>HTML form for user input<form action="/submit" method="POST">...</form>
<input>Input control (text, checkbox, radio, etc.)<input type="text" name="username">
<textarea>Multi-line text input<textarea rows="4" name="message"></textarea>
<button>Clickable button<button type="submit">Submit</button>
<select>Drop-down selection list<select><option>Option 1</option></select>
<option>Option in a select element<option value="1">Option 1</option>
<optgroup>Group of related options in select<optgroup label="Group"><option>...</option></optgroup>
<label>Label for a form element<label for="email">Email:</label>
<fieldset>Group of related form elements<fieldset><legend>Personal</legend>...</fieldset>
<legend>Caption for a fieldset<legend>Personal Info</legend>
<datalist>List of predefined options for an input<datalist id="browsers"><option value="Chrome"></datalist>
<output>Result of a calculation<output name="result">0</output>
<progress>Progress indicator<progress value="70" max="100">70%</progress>
<meter>Scalar measurement within a range<meter value="0.7" min="0" max="1">70%</meter>

About This Tool

HTML Tags Reference is a comprehensive lookup tool listing all HTML5 standard tags organized by category.

Each entry includes the tag's purpose, a short description, and a practical usage example to speed up development and learning.

How to Use

  1. Type a tag name in the search box or select a category filter.
  2. Click a tag name to copy it to your clipboard.
  3. Read the Description column to understand the tag's purpose.
  4. Check the Example column for a quick code snippet.

Use Cases

Use this reference when you can't recall a specific tag, when exploring HTML5 elements, or as a quick-start guide for HTML beginners.

FAQ

  • Are all HTML5 tags included?Yes, all major tags defined in the W3C HTML5 specification are covered.
  • How do I copy a tag name?Click the tag name in the table and it will be copied to your clipboard instantly.
  • How do I use the category filter?Click one of the category buttons at the top to show only tags in that category.