How do I install the Coding HTML skill?

Run npx skillmds@latest add scottermonk/coding-html in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Coding HTML safe to use?

This skill has not completed SkillMD's automated safety review yet. Capability flags: docs only. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Coding HTML?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Coding HTML free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Coding HTML?

ScotterMonk (@scottermonk) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Coding HTML by scottermonk — Agent Skill

Name: Coding HTML
Rating: 4.2 (5 reviews)
Author: ScotterMonk

Coding HTML

When html or jinja are being written or edited. Use this skill any time you are writing, editing, refactoring, or reviewing HTML (.html files or inline HTML) or Jinja2 templates. Trigger even for small HTML additions, new template blocks, editing existing template structure, or when a user says "update the layout", "fix the template", "add a section", or "edit the page". Load with read_file on .kilocode/skills/coding-html/SKILL.md (ignore the absolute path in the location tag).

ScotterMonk Updated Sep 10, 2026

File contents

HTML / Jinja2 Coding Standards

Syntax & Style

Quotes: Enforce Double Quotes (") over single quotes (') for HTML attributes and Jinja expressions.
- Good: <input type="text" name="email">
- Bad: <input type='text' name='email'>
Spacing: Keep vertical spacing compact — no excessive blank lines between elements.
Indentation: 2 spaces per level for HTML and Jinja blocks.
Readability: Prioritize readable, explicit markup over terse or clever one-liners.
Editor mode: Read skill-local guidance only when .kilocode/skills/coding-html/AGENTS.md is confirmed to exist; otherwise use root AGENTS.md for project-specific editor mode guidance.

CSS

Inline CSS: Prefer classes from .css files over inline style="" attributes, unless explicitly justified (e.g., dynamic values injected by Python).

JavaScript

Inline JS: Prefer referencing functions from .js files over inline <script> blocks or onclick="" attributes, unless explicitly justified.

Jinja2 Templates

Use {% block %} / {% endblock %} for template inheritance — don't duplicate layout HTML.
Wrap long Jinja expressions in {# comment #} comments to document intent.
Use {{ var | default('') }} to guard against undefined variable errors.
Prefer {% include %} for reusable partials (e.g., nav, footer, modals).
Keep business logic out of templates — pass pre-computed values from Python routes.

Mandatory Metadata

Preserve comments: Do NOT delete existing, still-relevant comments.

Every HTML section or Jinja block you create or significantly modify must have a comment header:

<!-- [Created-or-Modified] by [Model_Name] | YYYY-MM-DD_[Iteration] -->

Example: 

Place the comment immediately above the relevant <section>, <div>, or {% block %}.

Tooling Preference (Web)

Primary: Use web browser. Fallback: browser_action (only if web browser is unavailable or fails).

---name: coding-htmldescription: When html or jinja are being written or edited. Use this skill any time you are writing, editing, refactoring, or reviewing HTML (.html files or inline HTML) or Jinja2 templates. Trigger even for small HTML additions, new template blocks, editing existing template structure, or when a user says "update the layout", "fix the template", "add a section", or "edit the page". Load with read_file on .kilocode/skills/coding-html/SKILL.md (ignore the absolute path in the location tag).---# HTML / Jinja2 Coding Standards## Syntax & Style- **Quotes**: Enforce Double Quotes (`"`) over single quotes (`'`) for HTML attributes and Jinja expressions. - Good: `<input type="text" name="email">` - Bad: `<input type='text' name='email'>`- **Spacing**: Keep vertical spacing compact — no excessive blank lines between elements.- **Indentation**: 2 spaces per level for HTML and Jinja blocks.- **Readability**: Prioritize readable, explicit markup over terse or clever one-liners.- **Editor mode**: Read skill-local guidance only when `.kilocode/skills/coding-html/AGENTS.md` is confirmed to exist; otherwise use root `AGENTS.md` for project-specific editor mode guidance.## CSS**Inline CSS**: Prefer classes from `.css` files over inline `style=""` attributes, unless explicitly justified (e.g., dynamic values injected by Python).## JavaScript**Inline JS**: Prefer referencing functions from `.js` files over inline `<script>` blocks or `onclick=""` attributes, unless explicitly justified.## Jinja2 Templates- Use `{% block %}` / `{% endblock %}` for template inheritance — don't duplicate layout HTML.- Wrap long Jinja expressions in `{# comment #}` comments to document intent.- Use `{{ var | default('') }}` to guard against undefined variable errors.- Prefer `{% include %}` for reusable partials (e.g., nav, footer, modals).- Keep business logic out of templates — pass pre-computed values from Python routes.## Mandatory Metadata**Preserve comments**: Do NOT delete existing, still-relevant comments.**Every HTML section or Jinja block you create or significantly modify** must have a comment header:```html```Example: ``Place the comment immediately above the relevant `<section>`, `<div>`, or `{% block %}`.## Tooling Preference (Web)Primary: Use `web browser`.Fallback: `browser_action` (only if web browser is unavailable or fails).

Frequently asked questions