Pretty Mermaid Skills
Skill 확인됨Render beautiful Mermaid diagrams as SVG or ASCII art using the beautiful-mermaid library. Supports 15+ themes, 5 diagram types (flowchart, sequence, state, class, ER), and ultra-fast rendering. Use this skill when: 1. User asks to "render a mermaid diagram" or provides .mmd files 2. User requests "create a flowchart/sequence diagram/state diagram" 3. User wants to "apply a theme" or "beautify a diagram" 4. User needs to "batch process multiple diagrams" 5. User mentions "ASCII diagram" or "terminal-friendly diagram" 6. User wants to visualize architecture, workflows, or data models
This skill provides command-line tools to render Mermaid diagrams into SVG for web and documentation or ASCII art for terminals. It supports numerous themes, various diagram types, and batch processing capabilities, requiring Node.js 14+.
설치
npx skills add imxv/pretty-mermaid-skillsVercel skills CLI(skills.sh)를 npx로 실행합니다. 로컬에 Node.js와 skills 호환 에이전트(Claude Code, Cursor, Codex 등) 중 하나 이상이 설치되어 있어야 합니다. 저장소가 agentskills.io 형식을 따른다고 가정합니다.
유사한 확장
Mermaid Diagrams
95Proactively suggest diagrams when explaining complex systems. Triggers on diagrams, charts, visualizations, flowcharts, sequence diagrams, architecture diagrams, ER diagrams, state machines, Gantt charts, mindmaps, C4, class diagrams, git graphs. Use when user asks for visual representations of code, systems, processes, data structures, database schemas, workflows, or API flows. Generate Mermaid diagrams in markdown.
Blind Spot Detective
99Systematically identify what's missing in non-fiction writing—both blind spots (inherent limitations) and blank spots (gaps that could be addressed). Use before finalizing non-fiction or when feedback feels incomplete.
Customer Journey Mapper
98Maps the full customer journey from first touch to advocacy. Generates a comprehensive customer-journey.md with all stages, touchpoints, emotions, pain points, opportunities, Mermaid diagrams, and metrics. Use when mapping customer experience, designing onboarding flows, identifying churn risks, or optimizing conversion funnels.
3D Graphics with Three.js
983D web graphics with Three.js (WebGL/WebGPU). Capabilities: scenes, cameras, geometries, materials, lights, animations, model loading (GLTF/FBX), PBR materials, shadows, post-processing (bloom, SSAO, SSR), custom shaders, instancing, LOD, physics, VR/XR. Actions: create, build, animate, render 3D scenes/models. Keywords: Three.js, WebGL, WebGPU, 3D graphics, scene, camera, geometry, material, light, animation, GLTF, FBX, OrbitControls, PBR, shadow mapping, post-processing, bloom, SSAO, shader, instancing, LOD, WebXR, VR, AR, product configurator, data visualization, architectural walkthrough, interactive 3D, canvas. Use when: creating 3D visualizations, building WebGL/WebGPU apps, loading 3D models, adding animations, implementing VR/XR, creating interactive graphics, building product configurators.
ReClaude
98Refactor CLAUDE.md files to follow progressive disclosure principles. Use when CLAUDE.md is too long or disorganized.
Optimize for AI
98Optimize content for AI search engines — ChatGPT, Perplexity, Claude, Gemini, Google AI Overviews. Use when the user asks about AI SEO, AISO, getting cited by AI, appearing in AI answers, answer engine optimization, AEO, GEO, LLMO, AI Overviews, zero-click search, or how to appear in ChatGPT/Perplexity results. For traditional SEO, see diagnose-seo.