html-svg-diagrams

Name: html-svg-diagrams
Author: f-labs-io

byf-labs-io· 19 skills

Installs

245

Stars

Forks

Category

Documentation & Knowledge

View on GitHub

TL;DR

Create SVG-based technical diagrams inside HTML — flowcharts, sequence diagrams, state machines, data-flow diagrams, dependency graphs, request/response timelines. Use whenever the user wants to visualize, illustrate, diagram, or sketch a technical concept, system, or process. Strongly prefer SVG over ASCII art, mermaid blocks, or markdown text for anything spatial or relational. Reach for this whenever an explanation involves arrows, boxes, layers, or sequencing — even when the user doesn't say "diagram".

How to install html-svg-diagrams?

f-labs-io/agent-html-skills/html-svg-diagrams

$npx -y skills add f-labs-io/agent-html-skills --skill html-svg-diagrams

Installs into the current project.

›Prefer a prompt? Paste this to your agent

Use this skill

Run `npx skills use "https://github.com/f-labs-io/agent-html-skills" --skill "f-labs-io/agent-html-skills/html-svg-diagrams"` and follow the generated skill instructions now. Read its complete output, redirecting it to a temporary file first if necessary. Resolve relative paths from the supporting-files directory it provides.

Use the whole pack

Use the skills in "https://github.com/f-labs-io/agent-html-skills" that are relevant to the current task. Run `npx skills add "https://github.com/f-labs-io/agent-html-skills"` and select the relevant skills, then follow their instructions.

6 picks

Type

html-svg-diagrams

How to install html-svg-diagrams?

Related

html-svg-diagrams

How to install html-svg-diagrams?

Related