An automated engine that converts Markdown text into aesthetically pleasing HTML cards with customizable, theme-based inline styling.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install md-layout-engine
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install md-layout-engine using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is MD Layout Engine?
The MD Layout Engine is a sophisticated tool designed to bridge the gap between raw text and polished visual presentation. By analyzing Markdown input, it applies high-quality design patterns defined in external theme files to generate stand-alone HTML cards. This engine is specifically optimized for Openclaw Skills to ensure content looks professional across various platforms without requiring external stylesheets or complex build steps. It empowers developers and creators to maintain a consistent visual identity while writing in simple Markdown.
MD Layout Engine Use Cases
- Generating social media-ready snippets from Markdown notes.
- Creating visually appealing email newsletter components with inline styles.
- Standardizing documentation snippets into consistent card-style layouts.
- Automating the creation of summary cards for blogs and portfolio sites.
How MD Layout Engine Works
- The engine scans the input Markdown for a theme declaration comment or looks for a specific theme request in the natural language prompt.
- It locates and reads the corresponding theme definition file from the themes directory.
- The engine parses the Markdown content into standard HTML elements.
- It maps the CSS styles defined in the YAML-based theme file to each HTML element.
- The final output is wrapped in a responsive 720px card container and returned as a single HTML code block.
MD Layout Engine Setup
To integrate this capability into your Openclaw Skills workspace, ensure your directory structure supports theme storage:
# Create the themes directory
mkdir themes
# Add a default theme file
touch themes/brick-red.md
Ensure your theme files use the required YAML format: - element: style-string;.
MD Layout Engine Data Schema & Taxonomy
The skill organizes its styling logic through a file-based taxonomy:
| Component | Type | Description |
|---|---|---|
| themes/ | Directory | Stores all available visual styles for the engine. |
| [theme].md | YAML File | Contains a list of CSS rules mapped to HTML selectors. |
| Container | HTML div | A max-width 720px wrapper for the generated content. |
| Inline CSS | Style String | All styling is injected directly into elements for portability. |
MD Layout Engine Advanced Features
- Smart theme selection logic prioritizing metadata comments over default settings.
- Automated random theme selection for varied content presentation.
- Strict inline style enforcement ensuring compatibility with content platforms.
- Multi-theme support including ocean, forest, and minimal aesthetic presets.
- Native support for Openclaw Skills style mapping for rapid layout prototyping.
SKILL.md
Loading
Related Openclaw Skills
Music Downloader Skill
An AI-powered music downloader that fetches high-definition audio tracks and playlists from global streaming platforms.
Industry Intelligence
An automated industry intelligence agent that monitors competitors, regulations, and market trends to generate structured briefings and PDF reports.
Zhixing Heyi Framework
A practical framework integrating Wang Yangming's philosophy, Adlerian psychology, and modern action science to eliminate procrastination and achieve unity of knowledge and action.
Best Bilibili AI Subtitle
An automated AI tool for generating accurate Chinese and English subtitles for Bilibili content in minutes.
AI Face Merge CLI Skill
An AI-powered command-line tool that merges facial characteristics from two images into a single, cohesive portrait.
Huo15 Office Doc
An enterprise-grade Word document generation skill that automates professional formatting, versioning, and template matching.
Featured*
