Convert HTML to Pug

Pug (previously named Jade) is a clean, whitespace sensitive syntax for writing HTML. Convert your HTML into Pug code in the browser.

Face with waiting expression Nothing to see yet!

Loading takeymakey...
TakeyMakey code
Want this tool to do something else? Edit the code below and make it do whatever you want.
export const take = [
  { key: "html", type: "code", label: "HTML" },
  { key: "double", type: "toggle", label: "Double quotes", value: true },
  {
    key: "noattrcomma",
    type: "toggle",
    label: "Omit attribute comma",
    value: true,
  },
  { key: "noemptypipe", type: "toggle", label: "Omit lines with only pipe" },
  { key: "bodyless", type: "toggle", label: "Omit enveloping tags" },
  { key: "numeric", type: "toggle", label: "Numeric character entities" },
  {
    key: "indent",
    type: "dropdown",
    label: "Indent",
    options: ["Two spaces", "Four spaces", "Tabs"],
  },
  { key: "wrapLength", type: "number", label: "Wrap length", value: 80 },
  {
    type: "import",
    value: [
      "https://cdn.jsdelivr.net/npm/he@1.2.0/he.min.js",
      "https://cdn.jsdelivr.net/npm/html2jade@0.8.6/lib/html2jade.js",
    ],
  },
]

export const make = ({ html, indent, ...options }) => {
  if (!html) return

  options.nspaces = indent === "Four spaces" ? 4 : 2
  options.tabs = indent === "Tabs"

  return new Promise((res, rej) => {
    Html2Jade.convertHtml(html, options, (err, value) =>
      err ? rej(err) : res([{ type: "code", value }])
    )
  })
}

export const options = { mode: "iframe" }