agentmods.dev

Skills-Agent: Skill for Claude Code

.agent/skills/preview/SKILL.md

preview is a skill for Claude Code, Codex from VoTruongDanh/Skills-Agent. It costs 54 tokens per session (738 once invoked), scanned A, original, MIT.

A planning step that shows the expected result, user experience, wording, interaction, or generated content before it is fully built.

In plain words
What is it for?
Use it for UI mockups, user-flow previews, documentation drafts, API responses, messages, or other sample outputs.
Why use it?
It helps reveal unclear requirements and gather feedback before implementation work is done.

Skill for Claude CodeCodex

Written for no agent in particular: nothing here depends on one.

This is VoTruongDanh/Skills-Agent's own configuration. It tells Claude Code and Codex how to work on Skills-Agent itself, so it is not a mod to install elsewhere. Copy it as a starting point and replace the rules that are about this project. Everything Skills-Agent configures →

not rated 4repo changed 2mo ago A scan 54 tokens original MIT
View source ↗ VoTruongDanh/Skills-Agent
Reuse

Borrowing it

Nothing to install: this file belongs to VoTruongDanh/Skills-Agent. Take a copy, put it at the same path in your own repository, and replace the rules that are about this project with yours.

Copy the file
curl -O https://raw.githubusercontent.com/VoTruongDanh/Skills-Agent/main/.agent/skills/preview/SKILL.md
Clone the repo
git clone --depth 1 https://github.com/VoTruongDanh/Skills-Agent

Made for: Claude Code, Codex.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for preview

README.md
[![agentmods](https://agentmods.dev/badge/skills/votruongdanh/skills-agent/preview/github.svg)](https://agentmods.dev/skills/votruongdanh/skills-agent/preview)
Your own site
<a href="https://agentmods.dev/skills/votruongdanh/skills-agent/preview"><img src="https://agentmods.dev/badge/skills/votruongdanh/skills-agent/preview/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

agentmods 80×15 button for preview

Your own site · 80×15
<a href="https://agentmods.dev/skills/votruongdanh/skills-agent/preview"><img src="https://agentmods.dev/badge/skills/votruongdanh/skills-agent/preview.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 54 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 738 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00054 $0.00738
Opus 5.5 $0.00022 $0.00295
Sonnet 5.5 $0.00011 $0.00148
Haiku 4.5 $0.00005 $0.00074

Measured 2mo ago against content hash 45b49f5ead39, method: parsed. Prices are Anthropic first-party input rates as of 2026-10-07, from the pricing page.

Security

Grade A, and why

preview scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2mo ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

.agent/skills/preview/SKILL.md · 63 lines

How it starts

The opening of the file, as written. The whole thing — 63 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Memory Protocol

START: Read .ai-memory.md from project root. Check UI patterns, design decisions, existing previews, brand guidelines, and user flow notes. END: Update .ai-memory.md using Memory Compaction Rules with: what was previewed, assumptions, feedback, and confirmed decisions.

Goal

Show the user what the result will look or feel like before full implementation.

Agent Routing

  • If previewing UI/UX → read .kiro/skills/agents/agents/frontend-specialist.md and apply its knowledge
  • If previewing documentation → read .kiro/skills/agents/agents/documentation-writer.md and apply its knowledge
  • If previewing API response → read .kiro/skills/agents/agents/backend-specialist.md and apply its knowledge

Socratic Gate

Before previewing, verify:

  1. What artifact is being previewed? (UI, API output, document, flow?)
  2. What level of fidelity is expected? (wireframe, mockup, full sample?)
  3. Any specific requirements or constraints? If any answer is unclear, ASK before proceeding.

Workflow

  1. Read Memory — Load .ai-memory.md for project context and design history.
  2. Infer the artifact being previewed: UI, API output, document, message, workflow, or report.
  3. Produce a faithful mock, sample output, walkthrough, or structured preview.
  4. Highlight assumptions behind the preview.
  5. Identify what could change during implementation.
  6. Update Memory — Save preview details and decisions to .ai-memory.md.

Checklist

  • Artifact type identified

  • Preview is realistic and faithful

  • Assumptions clearly labeled

  • Mock data marked as illustrative

  • Implementation differences noted

  • Memory file updated

  • Clean code chuẩn (Standard clean code applied)

  • Cập nhật đầy đủ tất cả các file liên quan (All related files fully updated)

Rules

  • Keep previews realistic and consistent with the current project.
  • Label illustrative content clearly when it is mock data.
  • Avoid implying broad code changes; if the preview would require major refactor, CALL IT OUT and ASK before implementation.
  • Always read and update the memory file.

Read the full file on GitHub · 63 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 2mo ago Changed · +3 lines 45b49f5ead39
  2. 2mo ago First seen · 60 lines · 54 tokens per session scan A 9ef63046ebf1

Subscribe to this mod's changes

preview is a skill published in the GitHub repository VoTruongDanh/Skills-Agent (4 stars, last pushed 1mo ago), licensed MIT. It adds 54 tokens to every session and 738 once invoked, about $0.0002 per session on Opus 5.5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.

Design and UXPlanning
Related

preview compared with skills from other repositories

preview next to 6 skills from other repositories
ModTypeStarsLast pushLicenceScanTokensWorks with
previewVoTruongDanh/Skills-AgentSkill41mo agoMITA54Claude Code, Codex
webgl-holographic-foilnexu-io/open-designSkill106kyesterdayApache-2.0A41Claude Code, Codex
html-ppt-hermes-cyber-terminalnexu-io/open-designSkill106kyesterdayApache-2.0A53Claude Code, Codex
html-ppt-taste-brutalistnexu-io/open-designSkill106kyesterdayApache-2.0A78Claude Code, Codex
visual-ralphYeachan-Heo/oh-my-codexSkill34k3d agoMITA52Codex
glance-canonical-layoutsandroid/skillsSkill10kyesterdayApache-2.0A56Claude Code
accessibilitymicrosoft/hve-coreSkill1.6kyesterdayMITA47Claude Code