·mermaid-generator
>_

mermaid-generator

تقوم هذه المهارة بإنشاء مخططات سير عمل تفاعلية باستخدام مكتبة Mermaid JavaScript لوضعها في منطقة ضيقة من الكتاب المدرسي باستخدام إطار iframe. استخدم هذه المهارة عندما يطلب المستخدمون إنشاء مخططات انسيابية أو مخططات للعمليات أو تصورات سير العمل أو أشجار القرار للكتب المدرسية التعليمية. تقوم هذه المهارة بإنشاء حزم MicroSim مع ملفات HTML مستقلة تتميز بخلفيات ملونة وخطوط ذات 16 نقطة وعرض من أعلى إلى أسفل بشكل افتراضي، ويتم حفظها في /docs/sims/ باتباع نمط MicroSim.

5التثبيتات·0الرائج·@vishalsachdev

التثبيت

$npx skills add https://github.com/vishalsachdev/claude-skills --skill mermaid-generator

كيفية تثبيت mermaid-generator

ثبّت مهارة الذكاء الاصطناعي mermaid-generator بسرعة في بيئة التطوير لديك عبر سطر الأوامر

  1. افتح الطرفية: افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal
  2. نفّذ أمر التثبيت: انسخ ونفّذ هذا الأمر: npx skills add https://github.com/vishalsachdev/claude-skills --skill mermaid-generator
  3. تحقق من التثبيت: بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw

المصدر: vishalsachdev/claude-skills.

Generate simple minimalist but colorful interactive workflow diagrams using Mermaid.js for intelligent textbooks. Creates complete MicroSim packages with standalone HTML files, MkDocs integration, and Dublin Core metadata. Each diagram features colorful node backgrounds, 16-point fonts for optimal readability, and follows the educational MicroSim pattern.

Because this skill is part of the workflow for creation of textbooks using mkdocs, the design goal is to create simple unadorned diagrams without any complex padding, borders or decoration. This is because our focus is to educate, not entertain and show off our ability to do rounded corners and gradient shading.

If the description is incomplete or unclear, prompt the user for additional information:

تقوم هذه المهارة بإنشاء مخططات سير عمل تفاعلية باستخدام مكتبة Mermaid JavaScript لوضعها في منطقة ضيقة من الكتاب المدرسي باستخدام إطار iframe. استخدم هذه المهارة عندما يطلب المستخدمون إنشاء مخططات انسيابية أو مخططات للعمليات أو تصورات سير العمل أو أشجار القرار للكتب المدرسية التعليمية. تقوم هذه المهارة بإنشاء حزم MicroSim مع ملفات HTML مستقلة تتميز بخلفيات ملونة وخطوط ذات 16 نقطة وعرض من أعلى إلى أسفل بشكل افتراضي، ويتم حفظها في /docs/sims/ باتباع نمط MicroSim. المصدر: vishalsachdev/claude-skills.

حقائق جاهزة للاقتباس

حقول وأوامر مستقرة للاقتباس في أنظمة الذكاء الاصطناعي والبحث.

أمر التثبيت
npx skills add https://github.com/vishalsachdev/claude-skills --skill mermaid-generator
الفئة
>_الإنتاجية
موثق
أول ظهور
2026-02-01
آخر تحديث
2026-03-10

Browse more skills from vishalsachdev/claude-skills

إجابات سريعة

ما هي mermaid-generator؟

تقوم هذه المهارة بإنشاء مخططات سير عمل تفاعلية باستخدام مكتبة Mermaid JavaScript لوضعها في منطقة ضيقة من الكتاب المدرسي باستخدام إطار iframe. استخدم هذه المهارة عندما يطلب المستخدمون إنشاء مخططات انسيابية أو مخططات للعمليات أو تصورات سير العمل أو أشجار القرار للكتب المدرسية التعليمية. تقوم هذه المهارة بإنشاء حزم MicroSim مع ملفات HTML مستقلة تتميز بخلفيات ملونة وخطوط ذات 16 نقطة وعرض من أعلى إلى أسفل بشكل افتراضي، ويتم حفظها في /docs/sims/ باتباع نمط MicroSim. المصدر: vishalsachdev/claude-skills.

كيف أثبّت mermaid-generator؟

افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/vishalsachdev/claude-skills --skill mermaid-generator بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw

أين مستودع المصدر؟

https://github.com/vishalsachdev/claude-skills