agentleFS
Sign inStart free
Marwan-Ahmed-devMarwan-Ahmed-dev/vibecode-pro-max/.agents/skills/vc-preview/SKILL.md

vc:preview

Skill0 starsChanged 3 months agoMITView on GitHub

Use when you need to inspect files or generate visual explanations, slides, diagrams, or HTML recaps.

We split this skill into the rules it gives an agent

6 rules. About 0 are common, 4 are distinctive, and 2 are very specific to this project.

  • ≈0

    Common · estimate

    Many files like this have a rule of this kind.

  • ≈4

    Distinctive · estimate

    This author's own choices. Worth a look.

  • 2

    Very specific

    Tied to their project's names, files or tools. Probably skip.

  • Common
  • Distinctive
  • Very specific
  1. Very specific:

    Use preview as the companion and review surface.

    line 16
  2. Very specific:

    If invoked without arguments, use AskUserQuestion to present available operations: view file/dir, --explain, --slides, --diagram, --ascii, …

    line 20
  3. Distinctive:

    Do not invent file paths — verify the file exists before previewing

    line 38
  4. Distinctive:

    Do not silently fail on a missing operation — surface the error

    line 39
  5. Distinctive:

    Do not skip the AskUserQuestion when no arguments are given

    line 40
  6. Distinctive:

    Do not auto-transition to other skills without user confirmation

    line 41

≈ “Common” is an estimate: at least 1 in 5 of the 308,232 skill files we read have a rule of the same kind, not the same words. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.

Keep what fits and drop the rest. Your version, ready for your agents.
Files
SKILL.md

Preview

Universal viewer + visual generator. View existing content OR generate new visual explanations.

Diagram Boundary

Use preview as the companion and review surface. Use tech-graph first when the task needs a durable publish-grade SVG/PNG artifact under process/general-plans/references/, process/general-plans/reports/visuals/, or matching feature-scoped equivalents. After tech-graph generation, preview is still the right place for explanation, comparison, HTML framing, or self-review.

Default (No Arguments)

If invoked without arguments, use AskUserQuestion to present available operations: view file/dir, --explain, --slides, --diagram, --ascii, --html, --diff, --plan-review, --recap.

Generation Modes

Detailed patterns live in references/generation-modes.md:

  • HTML recap/diff/plan-review — interactive review pages
  • Slides — single-file HTML presentation decks
  • Diagram — Mermaid/architecture diagrams
  • ASCII — terminal-friendly tables/trees

For template files, see templates/ (architecture.html, data-table.html, mermaid-flowchart.html, slide-deck.html).

HTML/CSS Patterns

Load references/html-css-patterns.md for component patterns, references/html-design-guidelines.md for typography/spacing/colors, references/html-libraries.md for the available static libs (htmx, alpine, chart.js, etc.), references/html-responsive-nav.md for nav patterns, references/html-slide-patterns.md for slide-deck CSS, references/view-mode.md for the view-mode toggle contract.

Strict Rules

  • Do not invent file paths — verify the file exists before previewing
  • Do not silently fail on a missing operation — surface the error
  • Do not skip the AskUserQuestion when no arguments are given
  • Do not auto-transition to other skills without user confirmation

End every response with the subagent status block:

**Status:** DONE | DONE_WITH_CONCERNS | BLOCKED | NEEDS_CONTEXT
**Summary:** [1-2 sentence summary]
**Files modified:** [comma-separated list]
**Concerns/Blockers:** [if applicable]

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

Reviews can't be read right now.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

Check your setup, free