MR
Mayur Rathi
@mayurrathi
⭐ 5 GitHub stars

Wiki Vitepress

Packages generated wiki Markdown into a VitePress static site with dark theme, dark-mode Mermaid diagrams with click-to-zoom, and production build output. Use when the user wants to create a browsa...

mkdir -p ./skills/wiki-vitepress && curl -sfL https://raw.githubusercontent.com/mayurrathi/awesome-agent-skills/main/skills/wiki-vitepress/SKILL.md -o ./skills/wiki-vitepress/SKILL.md

Run in terminal / PowerShell. Requires curl (Unix) or PowerShell 5+ (Windows).

Skill Content

Packages generated wiki Markdown into a VitePress static site with dark theme, dark-mode Mermaid diagrams with click-to-zoom, and production build output. Use when the user wants to create a browsa...

🎯 Best For

  • Developers scaffolding new projects
  • Prototype builders
  • UI designers
  • Product designers
  • Claude users

💡 Use Cases

  • Bootstrapping React components
  • Creating API route handlers
  • Generating component mockups
  • Creating design system tokens

📖 How to Use This Skill

  1. 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. 2

    Load into Your AI Assistant

    Open Claude and reference the skill. Paste the SKILL.md content or use the system prompt tab.

  3. 3

    Apply Wiki Vitepress to Your Work

    Provide context for your task — paste source material, describe your audience, or share existing work to guide the AI.

  4. 4

    Review and Refine

    Edit the AI output for accuracy, tone, and completeness. Add human insight where the AI lacks context.

❓ Frequently Asked Questions

Can I customize the generated output?

Yes — modify the skill's prompt instructions to match your project conventions and coding style.

Does this work with Figma?

Some design skills integrate with Figma plugins. Check the Works With section for supported tools.

How do I install Wiki Vitepress?

Copy the install command from the Terminal tab and run it. The skill downloads to ./skills/wiki-vitepress/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

Using generated code without understanding

Understand what generated code does before shipping it to production.

Skipping usability testing

AI-generated designs should be validated with real users before development.

Not reading the full skill

Skills contain important context and edge cases beyond the quick start.

🔗 Related Skills