Danny 🎠 6 days ago
I LOVE THE NEW DESIGN SO MUCH AAAAAAAAAAH
nick 🤞 6 days ago
the new designs are finally here! still a few rough edges here and there, but we'll smooth them out. if you spot any bugs, tell us <3

HTML Tags

Written by Danny • 07.06.2025
#html

Recommended With

TagDescriptionExample
<html>Root of HTML document<html lang='en'>...</html>
—
<head>Document metadata<head><title>Title</title></head>
—
<title>Browser tab title<title>My Page</title>
<body>Main content<body><p>Hi</p></body>
Hi
<meta>Metadata<meta charset='UTF-8'>
—
<link>External resources<link rel='stylesheet' href='style.css'>
—
<style>Internal CSS<style>body {color: red;}
—
<script>JavaScript code<script>alert('Hi')</script>
(click to runs JS)

Text Content

TagDescriptionExample
<h1> to <h6>Headings<h1>Main</h1>

Main

<p>Paragraph<p>Hello</p>

Hello

<br>Line breakLine1<br>Line2
Line1
Line2
<hr>Horizontal rule<hr>
<pre>Preformatted text<pre> A\nB </pre>
 A
B
<blockquote>Block quote<blockquote>Quote</blockquote>
Quote

Lists

TagDescriptionExample
<ul>Unordered list<ul><li>A</li></ul>
  • A
<ol>Ordered list<ol><li>1</li></ol>
  1. 1
<li>List item<li>Item</li>
  • Item
    • <dl>Description list<dl><dt>HTML</dt><dd>Markup</dd></dl>
    HTML
    Markup

    Text Formatting

    TagDescriptionExample
    <a>Hyperlink<a href="https://designfreaks.net">Designfreaks</a>
    Designfreaks
    <b>Bold (styling)<b>Bold</b>
    Bold
    <strong>Strong importance<strong>Bold</strong>
    Bold
    <em>Emphasis<em>Italic</em>
    Italic
    <i>Italic (styling)<i>Italic</i>
    Italic
    <u>Underline<u>Underlined</u>
    Underlined
    <s>Strike through<s>Striked</s>
    Striked
    <mark>Highlight<mark>Highlight</mark>
    Highlight
    <small>Smaller text<small>Note</small>
    Small
    <sub>SubscriptH<sub>2</sub>O
    H2O
    <sup>Superscriptx<sup>2</sup>
    x2
    <code>Inline code<code>x = 1</code>
    x = 1
    <span>Generic inline<span>Text</span>
    Text

    Media

    TagDescriptionExample
    <img>Image<img src="https://image.png">
    <audio>Audio<audio controls src="file.mp3"></audio>
    <video>Video<video controls src="file.mp4"></video>
    <figure>Media with caption<figure><img><figcaption>Caption</figcaption></figure>
    Figure with caption

    Forms & Inputs

    TagDescriptionExample
    <form>Form<form action='/send'></form>
    Wraps the form
    <input>Input field<input type='text'>
    <textarea>Multiline input<textarea></textarea>
    <button>Button<button>Click</button>
    <select>Dropdown list<select><option>1</option></select>
    <label>Label for input<label for='id'>Label</label>

    Interactive

    TagDescriptionExample
    <details>Expandable details<details><summary>More</summary>Text</details>
    MoreText
    <summary>Summary for <details><summary>Info</summary>
    Info
    <dialog>Dialog box<dialog open>Hi!</dialog>
    Dialog

    Semantic Layout

    TagDescriptionExample
    <header>Page or section header<header>Welcome</header>
    Welcome
    <nav>Navigation links<nav><a href='#'>Link</a></nav>
    <main>Main content area<main>Stuff</main>
    Stuff
    <section>Thematic section<section>Content</section>
    Content
    <article>Independent article<article>Post</article>
    Post
    <aside>Sidebar content<aside>Tip</aside>
    <footer>Footer section<footer>End</footer>