SVG

baoyu-infographic 是一套用於結構化資訊圖表製作的提示框架，提供 21 種版型與 20 種風格。它能協助分析來源內容、選擇合適的版型與風格，並產出清楚的視覺化摘要，適合用於 UI 設計、比較整理、流程說明，以及其他資訊密度較高的解說內容。

diagram-generator 可依結構化輸入建立與編輯 draw.io、Mermaid、Excalidraw 圖表。它支援流程圖、序列圖、類別圖、ER 圖、心智圖、架構圖與網路拓撲，也能讀取既有的 .drawio、.mmd 與 Excalidraw 檔案，方便後續更新。

gsap-plugins 可協助前端開發者正確選擇、安裝與使用 GSAP 插件。內容涵蓋插件註冊、匯入方式，以及 ScrollToPlugin、ScrollSmoother、Flip、Draggable、Inertia、Observer、SplitText、ScrambleText、SVG plugins、easing tools 和 GSDevTools 的實務指引。當你需要的是清楚的 gsap-plugins 指南，而不是泛用的動畫建議時，就很適合使用它。

snipgrapher 可將原始碼轉成精緻、具語法高亮的 PNG、SVG 與 WebP 片段圖片，並支援可重用的主題、設定檔，以及以 CLI 驅動的渲染流程。當你需要為文件、變更紀錄、社群貼文，或用於 UI 設計的 snipgrapher 產出一致的素材時，就適合使用這個技能。它支援 install、config、batch 與 watch 工作流程，方便重複產出一致結果。

fireworks-tech-graph 是一個圖表繪製技能，可將系統描述轉換成可直接用於正式環境的 SVG 與 PNG 圖表。內容包含安裝指引、輔助腳本、驗證、範本與風格參考，適用於技術圖表、架構流程圖、序列圖與相關視覺工作流程。

graphviz 是一種以 DOT 為基礎的圖表繪製技能，可用來建立自動排版的有向圖與無向圖。適合用於相依性樹、呼叫圖、套件階層、權責關係圖，以及其他在圖表繪製場景中更重視可讀結構、而非手動擺位的 graphviz use cases。它能協助 agent 產生有效的 DOT，並減少版面或語法錯誤。

logo-generator 可協助你建立專業的 SVG 標誌與精緻的展示圖片，適用於產品、品牌與概念提案。它結合設計模式指引、6 種以上標誌變體、SVG 轉 PNG 匯出，以及背景展示圖生成。當你需要一套快速、結構化的 logo-generator 品牌設計流程，且希望輸出可編輯、預覽可直接簡報使用時，就適合使用這個 skill。

使用內嵌 SVG，製作精緻、深色主題的架構圖，並輸出為獨立 HTML 檔案。architecture-diagram 技能專為系統架構、基礎架構、雲端、安全性與網路拓樸圖而設計，提供可直接在瀏覽器開啟的視覺化成果，具備語意化配色、清晰的元件關係與一致的技術風格。

makepad-2.0-vector 是一個用於 SVG 風格 UI 設計的 Makepad 2.0 向量圖形技能。可用來透過 Vector{} 或 Svg{} 建立俐落的圖示、徽章、插圖、漸層、濾鏡、變形與動畫向量元素。這份指南可協助你安裝 makepad-2.0-vector，並取得較接近可直接實作的輸出，減少猜測。

seo-images 技能會分析 SEO 內容、產品頁、編輯文章與其他以圖片為主的頁面之圖片 SEO 與效能。它會檢查 alt 文字、檔案大小、格式、響應式傳送、lazy loading、CLS 風險、圖片 SERP 可見度，以及像 WebP/AVIF 與 IPTC/XMP metadata 這類最佳化選項。當你需要一份實用、可優先排序的圖片稽核時，就適合使用它。

logo-creator 是一套用於 AI 標誌製作的工作流程，支援產生概念稿、比較不同版本、裁切、去背，以及匯出 SVG 素材。它結合風格參考、範例提示詞與輔助腳本，可在 ReScienceLab/opc-skills 中用於建立 logo、icon、favicon 與品牌標記。