skills.rest
kreuzberg-dev
kreuzberg-devOFFICIAL
Explore all skills by this author →
WebsiteGitHub

image-conversion

Convert HTML image tags to Markdown with src, alt, and title attributes.

836|66|Updated Feb 3, 2025
Search Tags:#markdown#html#content migration#srcset#image conversion
One-click install
npx skills add https://github.com/kreuzberg-dev/html-to-markdown --skill image-conversion
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: image-conversion
Source: https://github.com/kreuzberg-dev/html-to-markdown/tree/main/.ai-rulez/domains/conversion-algorithms/skills/image-conversion
Command: npx skills add https://github.com/kreuzberg-dev/html-to-markdown --skill image-conversion

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill automates the conversion of HTML image tags into their Markdown equivalents, simplifying the process of embedding images in Markdown documents.

Core Features & Use Cases

  • HTML to Markdown Image Conversion: Transforms <img> tags into Markdown image syntax ![alt](src).
  • Attribute Handling: Correctly extracts and utilizes src, alt, and title attributes.
  • Responsive Image Support: Handles srcset for selecting appropriate image sources.
  • Use Case: When migrating content from an HTML website to a Markdown-based CMS, this Skill ensures all images are correctly represented in the new format.

Quick Start

Convert the HTML image tag <img src="image.jpg" alt="A sample image"> into Markdown format.

Frequently Asked Questions about image-conversion

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I convert HTML image tags to Markdown syntax?▼

To convert HTML image tags to Markdown syntax, the Skill transforms `<img>` tags into `![alt](src)` format. It automatically extracts the source, alt text, and title attributes to ensure images are correctly represented in Markdown environments.

What is the best way to handle responsive images during content migration to a Markdown CMS?▼

Handling responsive images during content migration is done by parsing the `srcset` attribute. The Skill processes `srcset` values to select appropriate image sources before generating the final Markdown image syntax.

Does HTML to Markdown image conversion sanitize URLs?▼

Yes, HTML to Markdown image conversion sanitizes URLs. During the transformation of HTML tags into Markdown format, the process includes URL sanitization to ensure clean and safe image source links.

How does converting HTML images handle attributes like alt text and title?▼

Converting HTML images handles attributes by correctly extracting and utilizing `src`, `alt`, and `title` elements. This ensures the resulting Markdown image syntax retains all descriptive and accessibility information.

When do I need to convert HTML images to Markdown format?▼

You need to convert HTML images to Markdown format when migrating content from an HTML website to a Markdown-based CMS. It simplifies embedding images by automating the transformation of `<img>` tags into Markdown equivalents.

Related Skills

Explore More Software Engineering Skills→
congthang12312congthang12312

seo-analyzer

Validate HTML/JSX pages for SEO compliance using a Python script and JSON ruleset.

Community
Intermediate
richtaborrichtabor
69

markdown-img-alt-text

Add detailed alt text to image embeds in Markdown files.

Community
Intermediate
xberg-ioxberg-io
26

converting-html

Convert HTML files to Markdown while preserving structure and formatting.

Official
Intermediate
robotostudiorobotostudio
172

portable-text-conversion

Convert HTML and Markdown content into Portable Text blocks for Sanity.

Official
Advanced