Pug to HTML Converter
Convert Pug (formerly Jade) template syntax to HTML. Expand indentation-based syntax to standard HTML tags.
2.2Kuses
8.5/10(310)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>My Page</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<header id="main-header">
<nav class="navbar">
<a class="logo" href="/">Home</a>
<ul class="nav-links">
<li>
<a href="/about">About</a>
</li>
<li>
<a href="/contact">Contact</a>
</li>
</ul>
</nav>
</header>
<main class="container">
<h1>Hello World</h1>
<p class="intro">This is a paragraph with a class.</p>
<div class="card">
<h2>Card Title</h2>
<p>Card content goes here.</p>
<img src="image.jpg" alt="An image" />
</div>
</main>
<footer>
<p>Copyright 2024</p>
</footer>
</body>
</html>How to Use
- Paste your Pug/Jade template code.
- HTML output is generated with proper tags and nesting.
- Copy the HTML output.
Note: This handles common Pug features (tags, classes, IDs, attributes, nesting). For advanced features like mixins and includes, use the official Pug compiler.
⚡ Pro OptionsSponsored
Some links on this page are affiliate links. If you click and make a purchase, we may earn a commission at no extra cost to you.
Recommended Products
Ad⌨️Mechanical KeyboardsShop →🖥️Ultrawide MonitorsShop →🪑Standing DesksShop →🎧Noise Cancelling HeadphonesShop →📚Programming BooksShop →💻Laptop StandsShop →🖱️Wireless MouseShop →🔌USB-C HubShop →👓Blue Light GlassesShop →🖥️Desk PadShop →
Affiliate Disclosure: As an Amazon Associate, ToolBird earns from qualifying purchases. Links above are affiliate links — if you buy through them, we may earn a small commission at no extra cost to you.
Disclaimer: This tool is provided as-is for informational and educational purposes only.