Markdown-To-Html
Markdown-To-Html是一款code方向的AI技能,核心价值是Convert Markdown files to HTML similar to `marked,可用于解决开发者在code领域的实际问题,帮助用户提升效率、自动化重复任务或优化工作流。
Convert Markdown files to HTML similar to `marked.js`, `pandoc`, `gomarkdown/markdown`, or similar tools; or writing custom script to convert markdown to html and/or working on web template systems li
mkdir -p ./skills/markdown-to-html && curl -sfL https://raw.githubusercontent.com/github/awesome-copilot/main/skills/markdown-to-html/SKILL.md -o ./skills/markdown-to-html/SKILL.md Run in terminal / PowerShell. Requires curl (Unix) or PowerShell 5+ (Windows).
Skill Content
# Markdown to HTML Conversion
Expert skill for converting Markdown documents to HTML using the marked.js library, or writing data conversion scripts; in this case scripts similar to [markedJS/marked](https://github.com/markedjs/marked) repository. For custom scripts knowledge is not confined to `marked.js`, but data conversion methods are utilized from tools like [pandoc](https://github.com/jgm/pandoc) and [gomarkdown/markdown](https://github.com/gomarkdown/markdown) for data conversion; [jekyll/jekyll](https://github.com/jekyll/jekyll) and [gohugoio/hugo](https://github.com/gohugoio/hugo) for templating systems.
The conversion script or tool should handle single files, batch conversions, and advanced configurations.
When to Use This Skill
- User asks to "convert markdown to html" or "transform md files"
- User wants to "render markdown" as HTML output
- User needs to generate HTML documentation from .md files
- User is building static sites from Markdown content
- User is building template system that converts markdown to html
- User is working on a tool, widget, or custom template for an existing templating system
- User wants to preview Markdown as rendered HTML
Converting Markdown to HTML
Essential Basic Conversions
For more see [basic-markdown-to-html.md](references/basic-markdown-to-html.md)
```markdown
# Level 1
## Level 2
One sentence with a [link](https://example.com), and a HTML snippet like `<p>paragraph tag</p>`.
- `ul` list item 1
- `ul` list item 2
1. `ol` list item 1
2. `ol` list item 1
| Table Item | Description |
| One | One is the spelling of the number `1`. |
| Two | Two is the spelling of the number `2`. |
```js
var one = 1;
var two = 2;
function simpleMath(x, y) {
return x + y;
}
console.log(simpleMath(one, two));
```
```
```html
<h1>Level 1</h1>
<h2>Level 2</h2>
<p>One sentence with a <a href="https://example.com">link</a>, and a HTML snippet like <code><p>paragraph tag</p></code>.</p>
<ul>
<li>`ul` list item 1</li>
<li>`ul` list item 2</li>
</ul>
<ol>
<li>`ol` list item 1</li>
<li>`ol` list item 2</li>
</ol>
<table>
<thead>
<tr>
<th>Table Item</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>One</td>
<td>One is the spelling of the number `1`.</td>
</tr>
<tr>
<td>Two</td>
<td>Two is the spelling of the number `2`.</td>
</tr>
</tbody>
</table>
<pre>
<code>var one = 1;
var two = 2;
function simpleMath(x, y) {
return x + y;
}
console.log(simpleMath(one, two));</code>
</pre>
```Code Block Conversions
For more see [code-blocks-to-html.md](references/code-blocks-to-html.md)
```markdown
your code here
```
```html
<pre><code class="language-md">
your code here
</code></pre>
```
```js
console.log("Hello world");
```
```html
<pre><code class="language-js">
console.log("Hello world");
</code></pre>
```
```markdown
```
```
visible backticks
```
```
```
```html
<pre><code>
```
visible backticks
```
</code></pre>
```Collapsed Section Conversions
For more see [collapsed-sections-to-html.md](references/collapsed-sections-to-html.md)
```markdown
<details>
<summary>More info</summary>
### Header inside
- Lists
- **Formatting**
- Code blocks
```js
console.log("Hello");
```
</details>
```
```html
<details>
<summary>More info</summary>
<h3>Header inside</h3>
<ul>
<li>Lists</li>
<li><strong>Formatting</strong></li>
<li>Code blocks</li>
</ul>
<pre>
<code class="language-js">console.log("Hello🎯 Best For
- Claude users
- GitHub Copilot users
- Software engineers
- Development teams
- Tech leads
💡 Use Cases
- Code quality improvement
- Best practice enforcement
📖 How to Use This Skill
- 1
Install the Skill
Copy the install command from the Terminal tab and run it. The SKILL.md file downloads to your local skills directory.
- 2
Load into Your AI Assistant
Open Claude or GitHub Copilot and reference the skill. Paste the SKILL.md content or use the system prompt tab.
- 3
Apply Markdown-To-Html to Your Work
Open your project in the AI assistant and ask it to apply the skill. Start with a small module to verify the output quality.
- 4
Review and Refine
Review AI suggestions before committing. Run tests, check for regressions, and iterate on the skill output.
❓ Frequently Asked Questions
Is Markdown-To-Html compatible with Cursor and VS Code?
Yes — this skill works with any AI coding assistant including Cursor, VS Code with Copilot, and JetBrains IDEs.
Do I need specific dependencies for Markdown-To-Html?
Check the install command and Works With section. Most code skills only require the AI assistant and your codebase.
How do I install Markdown-To-Html?
Copy the install command from the Terminal tab and run it. The skill downloads to ./skills/markdown-to-html/SKILL.md, ready to use.
Can I customize this skill for my team?
Absolutely. Edit the SKILL.md file to add team-specific instructions, examples, or workflows.
⚠️ Common Mistakes to Avoid
Skipping validation
Always test AI-generated code changes, even for simple refactors.
Missing dependency updates
Check if the skill requires updated dependencies or new packages.