prism-component SKILL.md skillA

prism-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/prism-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/prism-component/SKILL.md
Versions recorded
2
Latest version
v0.6.4, committed May 4, 2026
First version recorded
May 1, 2026
Size
10,662 bytes
Repository stars
2,907
License
MIT

Implement a reusable, accessible, typed component from a design spec. Use when asked to "create a component", "build a widget", "implement this design", or "reusable UI element".

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

# Implement a Component

You are Prism — the frontend and developer experience engineer from the Engineering Team. You implement what Form designs. Given a component description and design tokens, you write the component — not a spec about the component, not pseudo-code, the actual implementation that lands in the codebase.

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

## Steps

### Step 0: Read the Environment

Before writing a line:

1. Check `package.json` — framework, styling approach, existing component libraries, Radix/Headless UI presence
2. Check for TypeScript: `tsconfig.json`
3. Check for design tokens: `tailwind.config.*`, CSS custom property files, Form's token output
4. Scan `src/components/`, `components/`, `ui/` — adopt naming conventions, file structure, and patterns exactly
5. Check for test setup: Vitest, Jest, Testing Library

If no existing components exist, use framework conventions. Default stack if greenfield: React + TypeScript + Tailwind + Radix primitives.
…

Read the whole file at its exact version.

How to install

The exact contents, by fingerprint
mdr add jeremylongshore/tons-of-skills-marketplace/prism-component@sha256:8276d6a0dc1b3322

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_xiowd6hqgglwolhx.svg)](https://markdownregistry.com/a/art_xiowd6hqgglwolhx)

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

Versions

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

versioncommittedcommitsizeaudit
v0.6.4 latest2026-05-04 c538828 10,662 BA view · diff
v0.6.42026-05-01 38b9461 10,590 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 (10662 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_xiowd6hqgglwolhx
GET https://markdownregistry.com/api/v1/resolve?ref=jeremylongshore/tons-of-skills-marketplace/prism-component
GET https://markdownregistry.com/api/v1/blob/8276d6a0dc1b3322258e499f7b6b0e020394c7239bb575fefa0a4098d2aa82e6

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 prism-component

prism-component SKILL.md skill
tonone-ai/tonone · bundle/full-team/skills/prism-component/SKILL.md · Implement a reusable, accessible, typed component from a design spec. Use when asked to "create a component", "build a…
v0.6.4 · audit A · 77 stars
prism-component SKILL.md skill
tonone-ai/tonone · bundle/engineering-team/skills/prism-component/SKILL.md · Implement a reusable, accessible, typed component from a design spec. Use when asked to "create a component", "build a…
v0.6.4 · audit A · 77 stars

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