Files
skills/format-html/SKILL.md
2026-08-24 00:31:57 +04:00

2.8 KiB

name, description, license, metadata
name description license metadata
format-html Prettify raw HTML markup provided by the user. Use when the user sends HTML and asks to make it readable, format, indent, or pretty-print it. Output is properly indented (4 spaces), with elements placed on new lines according to nesting depth, and text inside tags kept on a single line. Fix missing or extra opening/closing tags as part of the cleanup. MIT
author version
Valentin Silyutin 1.0.0

HTML Formatting

Your task is to format the HTML code provided by the user. Make it clean, valid, and readable, and output only the resulting HTML code without any markdown commentary or explanations.

Formatting Rules

  1. Indentation: Use 4 spaces per nesting level. Do not use tabs.
  2. Line Breaks & Nesting:
    • Place each block-level element on a new line matching its indentation level.
    • Void tags (e.g., <img>, <br>, <meta>, <input>, <link>, <hr>, <source>) must be placed on their own line when nested inside block elements.
    • Inline Elements: Keep inline elements (e.g., <span>, <a>, <strong>, <em>, <code>) inline with surrounding text to preserve natural whitespace and avoid unintended spacing bugs.
  3. Text Nodes: Keep regular text inside block tags on a single line — do not wrap based on arbitrary line width.
  4. Preserved Content (<pre>, <textarea>, <script>, <style>):
    • Do not alter the inner whitespace, indentation, or newlines inside <pre> and <textarea> elements.
    • Keep scripts and styles intact, only indenting the container tags.
  5. Attributes:
    • Place attributes on the same line as the opening tag.
    • If an element has many attributes and exceeds standard line length, you may place one attribute per line, indented relative to the tag.
    • Use double quotes (") for attribute values.
  6. DOCTYPE & Void Tags:
    • Keep standard <!DOCTYPE html>, <html>, <head>, <body> structure.
    • Normalize void tags to HTML5 syntax without trailing slashes (e.g., <img src="...">, <input type="...">, <br>, <hr>).
  7. Blank Lines: Do not add redundant empty lines between sibling elements. Use a single blank line only to separate major layout landmarks if appropriate.

Structural Repair

Fix any syntax and hierarchy issues present in the input HTML:

  • Missing closing tags: Add them in the correct hierarchical positions.
  • Extraneous closing tags: Remove orphaned tags.
  • Invalid nesting: Correct overlapping tags (e.g., turn <b><i></b></i> into <b><i></i></b>).
  • Content preservation: Never rewrite text copy, invent missing content, or modify functional attribute values.

Strict Output Format

  • Output only the raw formatted HTML within a single markdown code block (or direct HTML stream).
  • No greetings, explanations, diffs, or follow-up notes.