skills.rest
chuanyue98
chuanyue98COMMUNITY
Explore all skills by this author →
GitHub

space-text-logic-diagram

Convert Chinese articles into logic-relationship SVG diagrams packaged as standalone HTML files.

Updated Aug 16, 2026
Search Tags:#html#svg#wechat#diagram#text visualization#chinese content#logic diagram
One-click install
npx skills add https://github.com/chuanyue98/skillhub --skill space-text-logic-diagram-chuanyue98
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: space-text-logic-diagram
Source: https://github.com/chuanyue98/skillhub/tree/main/vendored/SpaceZephyr/creator-buddy/gzh-Skills/space-text-logic-diagram
Command: npx skills add https://github.com/chuanyue98/skillhub --skill space-text-logic-diagram-chuanyue98

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes assets (resource) components.

What problem does it solve? Turning a long article or argument into a clear visual diagram for WeChat official account posts normally requires manual design work; this Skill automates the analysis of text logic and the generation of publication-ready diagrams. ## Core Features & Use Cases - Text-to-Diagram Conversion: Analyzes articles or paragraphs, extracts core concepts, and maps them to six relationship types: progression, process, cycle, hierarchy, comparison, and matrix. - Standalone HTML Output: Generates a self-contained HTML file with inline SVG, dark/light theme switching, and a warm Cursor/Claude-inspired design system, ready for local preview or PNG screenshot export. - Multi-Diagram Support: Splits texts with multiple logical sections into several labeled SVG diagrams within one HTML file, sized for WeChat image ratios (16:9, 3:2, 1:1, 2.35:1). - Use Case: Paste a WeChat article draft and ask for a logic diagram; receive an HTML file with styled SVG visuals you can screenshot and insert directly into your post. ## Quick Start Paste your article or paragraph and ask the AI to generate a logic relationship diagram as an HTML file using this Skill.

Frequently Asked Questions about space-text-logic-diagram

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

FAQPage Schema
How do I turn an article into a logic diagram?▼

Paste the article or paragraph and request a logic relationship diagram. The Skill analyzes the text, extracts 2-6 core concepts per section, picks a relationship type, and outputs a standalone HTML file containing inline SVG diagrams.

What types of logic diagrams can be generated from text?▼

Six relationship types are supported: progression, process, cycle, hierarchy, comparison, and matrix. Each type has its own visual layout rules, such as ring arrangements for cycles and grid layouts for matrices.

Can I export the generated diagram as a PNG image?▼

The primary output is a self-contained HTML file with inline SVG that you open in a browser and screenshot to PNG. Alternatively, the extracted logic structure can be handed to a built-in image generation model for a rendered PNG.

Does the diagram output support Chinese text?▼

Yes, the Skill is designed for Chinese content. Node text uses Chinese with English kept for technical terms, node widths are estimated for double-width characters, and concept names are limited to 2-10 Chinese characters.

What image sizes work for WeChat official account posts?▼

The Skill recommends 16:9 or 3:2 for in-article images, 1:1 for square images, and 2.35:1 for header images. The HTML canvas is generated according to these ratios.

Related Skills

Explore More Content & Communication Skills→
mambo-wangmambo-wang
3

edit-article

Restructures article sections and rewrites prose for clarity and flow.

Community
Basic
SpaceZephyrSpaceZephyr
333

baoyu-post-to-wechat

Publish markdown, HTML, or plain text to WeChat Official Account drafts and image-text posts.

Community
Advanced
huangservahuangserva
155

illustration-generator

Generate cover images and inline illustrations from article content.

Community
Intermediate
pynbj1001pynbj1001
4

Art

Generate editorial hand-drawn diagrams from content prompts.

Community
Advanced