form-component SKILL.md skillA

form-component from jeremylongshore/tons-of-skills-marketplace is an agent skill: a SKILL.md folder an AI agent loads when a task calls for it.

Install it, pinned
mdr add jeremylongshore/tons-of-skills-marketplace/form-component@v0.6.4

Pins v0.6.4 in mdr.lock. Pin the fingerprint instead.

Audit grade
A, 17 of 17 checks passed
Kind
SKILL.md skill
Repository
jeremylongshore/tons-of-skills-marketplace
Path
plugins/ai-agency/tonone/skills/form-component/SKILL.md
Versions recorded
2
Latest version
v0.6.4, committed May 12, 2026
First version recorded
May 4, 2026
Size
17,501 bytes
Repository stars
2,907
License
MIT

Use when asked to design a UI component, specify a button, input, card, modal, badge, or any interactive element. Examples: "design a button component", "spec out the input field", "define the card component states", "create a component spec for Prism", "what should the dropdown look like".

Collected from public GitHub. Every version is saved exactly as it was and never changes. Install it at an exact version with the mdr tool, and every file is checked before it reaches your agent. The main file is checked against the SHA-256 fingerprint recorded here, and the others against the fingerprints GitHub keeps for its source commit. The automatic checks below grade the latest version, and the same checks always give the same file the same grade.

What the file says

# Form Component

You are Form — the visual designer on the Product Team. Your output here is the spec that Prism implements — be precise.

Component design is a multi-phase process. You do not write a single pixel value until you know which component, which context, and which token layer you are building against. This skill has 5 phases. Move through them in order. Do not skip phases.

Follow the output format defined in docs/output-kit.md — 40-line CLI max, box-drawing skeleton, unified severity indicators, compressed prose.

---

## Phase 1: Discovery

Before any visual work, establish what is being specified and where it lives. Ask these questions. Do not ask them all at once — lead with the most critical blockers and follow up.

### Component Identity

- Which component(s) are being specified? (button, input, card, badge, modal, dropdown, toggle, checkbox, tooltip, etc.)
- Is this a net-new component or a modification of an existing one?
- If existing: what does the current component look like, and what is wrong or missing?

### Context

- Where does this component appear in the product? (primary CTA, form field, data table, navigation, empty state, etc.)
…

Read the whole file at its exact version.

How to install

The exact contents, by fingerprint
mdr add jeremylongshore/tons-of-skills-marketplace/form-component@sha256:6191c0c57fe759f9

The line at the top of this page pins the label v0.6.4, which is what most people want. This one pins the sha256 fingerprint of the contents instead, so it survives a label being moved. Either way the exact version is written to mdr.lock, and mdr install downloads and checks those contents again, so it installs them exactly or stops with an error.

Badge

mdr badge

[![mdr](https://markdownregistry.com/badge/art_j2emgcuflpy5k6mk.svg)](https://markdownregistry.com/a/art_j2emgcuflpy5k6mk)

4 badge image fetches in 30 days. What the badge shows.

Versions

The registry has recorded 2 versions of this file, between May 4, 2026 and May 12, 2026, about one every 9 days.

versioncommittedcommitsizeaudit
v0.6.4 latest2026-05-12 114fb5d 17,501 BA view · diff
v0.6.42026-05-04 c538828 17,573 BA view

Audit of the latest version

A  17 of 17 checks passed. Fixed automatic checks with no AI involved, so the same checks give the same answer every run.
  • pass: Frontmatter block present
  • pass: Frontmatter declares a name
  • pass: Frontmatter declares a description
  • pass: Size between 200 bytes and 200 KB (17501 bytes)
  • pass: No zero-width or bidi control characters
  • pass: No instruction hidden inside an HTML comment
  • pass: No link to an exfiltration or paste host
  • pass: No credential-shaped string
  • pass: No instruction to send local credentials anywhere
  • pass: No text hidden with inline styles
  • pass: No prompt-injection phrasing
  • pass: No curl or wget piped into a shell
  • pass: No recursive delete of root, home or parent
  • pass: No instruction to read or print local credentials
  • pass: No base64 blob over 200 characters
  • pass: No link to a raw IP address
  • pass: No script tag

Source

GitHub

jeremylongshore/tons-of-skills-marketplace · 2,907 stars · license MIT · pushed 2026-11-08 · branch main

API

GET https://markdownregistry.com/api/v1/artifacts/art_j2emgcuflpy5k6mk
GET https://markdownregistry.com/api/v1/resolve?ref=jeremylongshore/tons-of-skills-marketplace/form-component
GET https://markdownregistry.com/api/v1/blob/6191c0c57fe759f9573344a9f68fd490aadd7a8e8100dee52322bcf4943d4903

Your AI assistant does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.

Guides: the SKILL.md format and its required fields · what to check before you install a skill · how to pin a skill to an exact version · where to find agent skills · keeping a team on the same skills · which agent file does what.

More from jeremylongshore/tons-of-skills-marketplace

beads SKILL.md skill
jeremylongshore/tons-of-skills-marketplace · .agents/skills/beads/SKILL.md · Use when working in a repository that uses bd or Beads for durable project task tracking, issue dependencies, blocker…
git:20261022.33a49ad · audit A · 2,907 stars
AGENTS.md AGENTS.md file
jeremylongshore/tons-of-skills-marketplace · AGENTS.md
git:20261022.33a49ad · audit A · 2,907 stars
CLAUDE.md CLAUDE.md file
jeremylongshore/tons-of-skills-marketplace · CLAUDE.md
git:20261022.f12c241 · audit A · 2,907 stars
DESIGN.md@marketplace DESIGN.md file
jeremylongshore/tons-of-skills-marketplace · marketplace/DESIGN.md
git:20260910.e6f3178 · audit A · 2,907 stars
agency-os SKILL.md skill
jeremylongshore/tons-of-skills-marketplace · plugins/ai-agency/agency-os/skills/agency-os/SKILL.md · Notion-as-source-of-truth dispatch board for running your work like an AI agency. One Tasks database is the source of…
v0.2.0 · audit A · 2,907 stars
audit SKILL.md skill
jeremylongshore/tons-of-skills-marketplace · plugins/ai-agency/hyperflow/skills/audit/SKILL.md · Use when the user wants a code review on recent changes — quality, spec, security, or performance feedback. Triggers a…
v3.1.3 · audit A · 2,907 stars
background SKILL.md skill
jeremylongshore/tons-of-skills-marketplace · plugins/ai-agency/hyperflow/skills/background/SKILL.md · Use when the user wants to see, inspect, cancel, or prune background agents fired during prior chain runs. Read/manage…
v4.7.0 · audit A · 2,907 stars
bridge SKILL.md skill
jeremylongshore/tons-of-skills-marketplace · plugins/ai-agency/hyperflow/skills/bridge/SKILL.md · Use when the user wants hyperflow's behavioral rules to apply outside the terminal CLI — in Claude Code Desktop…
v4.10.1 · audit A · 2,907 stars
cache SKILL.md skill
jeremylongshore/tons-of-skills-marketplace · plugins/ai-agency/hyperflow/skills/cache/SKILL.md · Use when the user wants to view, search, add, edit, prune, archive, or clear hyperflow memory entries. CRUD interface…
v3.1.3 · audit A · 2,907 stars
deploy SKILL.md skill
jeremylongshore/tons-of-skills-marketplace · plugins/ai-agency/hyperflow/skills/deploy/SKILL.md · Use when ready to ship — runs pre-push gates (lint, typecheck, build, tests, security sweep), commits, releases, and…
v3.1.3 · audit A · 2,907 stars
design SKILL.md skill
jeremylongshore/tons-of-skills-marketplace · plugins/ai-agency/hyperflow/skills/design/SKILL.md · Use when the user wants the visual/experiential design of a product done systematically — a design system, a screen, a…
v1.0.0 · audit A · 2,907 stars
dispatch SKILL.md skill
jeremylongshore/tons-of-skills-marketplace · plugins/ai-agency/hyperflow/skills/dispatch/SKILL.md · Use when a task file exists in .hyperflow/tasks/ and workers need dispatching. Fans out parallel workers under…
v3.2.0 · audit A · 2,907 stars

Every file in jeremylongshore/tons-of-skills-marketplace

Other files named form-component

form-component SKILL.md skill
tonone-ai/tonone · bundle/full-team/skills/form-component/SKILL.md · Use when asked to design a UI component, specify a button, input, card, modal, badge, or any interactive element…
v0.6.4 · audit A · 77 stars

Browse by kind, by grade A, or by owner.