HTML Learning Lab

A safe little lab for practicing beginner HTML without scary code tools.

Pick a starter example, edit the code, and watch the preview update. Only a small safe set of HTML tags is allowed here, so it stays fun and beginner-friendly.

Starter snippets

Tap one and remix it

Editor

Practice HTML

Headings + Paragraphs

Tip: Change the words first. Once that feels easy, try changing the heading level from h2 to h3.

Allowed tags include headings, paragraphs, links, lists, bold, italic, blockquotes, images, and a few safe layout containers. Scripts and risky HTML are removed automatically.

Preview

What it looks like

Hello, internet!

My name is Molly, and this is my practice HTML card.

  • Favorite snack: strawberry pocky
  • Current game: Stardew Valley
  • Anime mood: found family forever

Cheat sheet

Common tags explained simply

Start with structure

These tags help you organize ideas before you worry about making things fancy.

<h2> A section heading. Great for titles inside a card or page section.
<p> A normal paragraph. Most writing on a page starts here.
<section> A bigger container for a chunk of content that belongs together.

Make text expressive

These tags are perfect for adding emphasis or a little extra drama.

<strong> Makes text bold and more important.
<em> Makes text italic and a little softer or more thoughtful.
<blockquote> Highlights a quote, lyric, or dramatic thought.

Build interactive pieces

These tags let you make links, lists, and tiny content groups.

<a> Creates a clickable link to another page or site.
<ul><li> Creates a bullet list with one item per li tag.
<div> A simple container for grouping content inside a section.

Safety rails

Why this lab is safe

The preview is sanitized on the server before it comes back to the page. That means dangerous scripts get stripped out instead of running.

  • Scripts and risky HTML are removed before the preview appears.
  • Image tags are limited to regular web image links, so no sneaky code can run.
  • The built-in lab classes are only there to make your practice examples feel more fun.

Think of this like a creative practice notebook, not an anything-goes developer console.