frontend-ui SKILL.md skillA

frontend-ui from j-star-films-studios/vibecode-protocol-suite is an agent skill: a SKILL.md folder an AI agent loads when a task calls for it.

Install it, pinned
mdr add j-star-films-studios/vibecode-protocol-suite/frontend-ui@v2.2.0

Pins v2.2.0 in mdr.lock. Pin the fingerprint instead.

Audit grade
A, 17 of 17 checks passed
Kind
SKILL.md skill
Repository
j-star-films-studios/vibecode-protocol-suite
Path
assets/.agent/skills/frontend-ui/SKILL.md
Versions recorded
6
Latest version
v2.2.0, committed Oct 16, 2026
First version recorded
Aug 20, 2026
Size
2,512 bytes
Repository stars
26
License
ISC

Use when designing web or mobile UI, creating prototypes, directing or engineering distinctive web experiences, structuring evidence-based web narratives, reviewing visible UI copy for unsupported claims ('unslop-gpt-ui'), applying UI/UX guidance, using 21st.dev components, Stitch, or Figma.

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

# Frontend UI Suite

Design systems, interactive component libraries, throwaway prototyping patterns, creative WebGL experiences, and responsive UI guidelines.

## Sub-Skills

| Sub-Skill | Purpose | Path |
|---|---|---|
| **`prototyping-variants`** | Two-branch throwaway prototyping: Logic Simulator HTML demo & in-app UI variant switch bar | [`prototyping-variants/SKILL.md`](prototyping-variants/SKILL.md) |
| **`story-engineer`** | Evidence-backed case-study and project-history narratives | [`story-engineer/SKILL.md`](story-engineer/SKILL.md) |
| **`creative-web-development`** | Concept direction, experience architecture, motion, Canvas, WebGL, Three.js, and GLSL | [`creative-web-development/SKILL.md`](creative-web-development/SKILL.md) |
| **`frontend-design`** | Foundational frontend design principles and typography | [`frontend-design/SKILL.md`](frontend-design/SKILL.md) |
| **`ui-ux-pro-max`** | High-end visual styling, animations, and micro-interactions | [`ui-ux-pro-max/SKILL.md`](ui-ux-pro-max/SKILL.md) |
| **`21st-dev-components`** | Modern UI component patterns from 21st.dev | [`21st-dev-components/SKILL.md`](21st-dev-components/SKILL.md) |
…

Read the whole file at its exact version.

How to install

The exact contents, by fingerprint
mdr add j-star-films-studios/vibecode-protocol-suite/frontend-ui@sha256:c375f4f632a9b4fd

The line at the top of this page pins the label v2.2.0, 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_uicez47w2j5yfmnv.svg)](https://markdownregistry.com/a/art_uicez47w2j5yfmnv)

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

Versions

The registry has recorded 6 versions of this file, between Aug 20, 2026 and Oct 16, 2026, about one every 12 days.

versioncommittedcommitsizeaudit
v2.2.0 latest2026-10-16 b05eb1a 2,512 BA view · diff
v2.2.02026-09-01 dd3ef97 2,287 BA view · diff
v2.1.02026-08-28 a322d46 2,363 BA view · diff
v2.1.02026-08-28 97212a1 2,185 BA view · diff
v2.0.02026-08-21 1b830a3 1,864 BA view · diff
v2.0.02026-08-20 4dbe9e4 1,812 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 (2512 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

j-star-films-studios/vibecode-protocol-suite · 26 stars · license ISC · pushed 2026-10-17 · branch main

API

GET https://markdownregistry.com/api/v1/artifacts/art_uicez47w2j5yfmnv
GET https://markdownregistry.com/api/v1/resolve?ref=j-star-films-studios/vibecode-protocol-suite/frontend-ui
GET https://markdownregistry.com/api/v1/blob/c375f4f632a9b4fd2913edc9e0a32115f15b85ea96e762965d12c8dfce21dd55

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 j-star-films-studios/vibecode-protocol-suite

skill-curator SKILL.md skill
j-star-films-studios/vibecode-protocol-suite · .agents/skill-curator/SKILL.md · Use when adding, importing, reorganizing, renaming, or refactoring skills according to the Lean Unified Skills…
v1.0.0 · audit A · 26 stars
unslop SKILL.md skill
j-star-films-studios/vibecode-protocol-suite · .agents/skills/unslop/SKILL.md · Use when writing any text, chat responses, documentation, UI copy, or skill instructions. Cuts AI tells, filler, and…
v1.0.0 · audit A · 26 stars
AGENTS.md AGENTS.md file
j-star-films-studios/vibecode-protocol-suite · AGENTS.md
git:20260926.7aeecb2 · audit A · 26 stars
AGENTS.md@assets/.agent/skills AGENTS.md file
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/AGENTS.md
git:20260912.a111be5 · audit A · 26 stars
agent-engineering SKILL.md skill
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/SKILL.md · Use when engineering LLM prompts, compiling skills from sources ('source-to-skill'), engineering expert systems…
v2.1.0 · audit A · 26 stars
arena SKILL.md skill
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/arena/SKILL.md · Spawn N parallel candidates at the same task, pick a base, graft the strongest parts of the losers into it. Use for…
git:20260821.1b830a3 · audit A · 26 stars
automate-me SKILL.md skill
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/automate-me/SKILL.md · Use for "automate me", "create/update/refresh my -mode skill", "turn/capture my preferences or working style into a…
git:20260821.1b830a3 · audit A · 26 stars
codex-control SKILL.md skill
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/codex-control/SKILL.md · Use when Pi needs to delegate browser, desktop, or native-plugin tasks to the installed Codex CLI.
v1.0.0 · audit A · 26 stars
to-spec SKILL.md skill
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/conversation-to-spec/SKILL.md · Turn the current conversation into a spec and publish it to the project issue tracker: no interview, just synthesis of…
git:20260821.1b830a3 · audit A · 26 stars
crafting-effective-readmes SKILL.md skill
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/crafting-effective-readmes/SKILL.md · Use when writing or improving README files. Not all READMEs are the same — provides templates and guidance matched to…
git:20260820.4dbe9e4 · audit A · 26 stars
create-verification-skill SKILL.md skill
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/create-verification-skill/SKILL.md · Generate a project-local verification skill that drives your app the way a user does — any language, framework, or…
git:20260821.1b830a3 · audit A · 26 stars
domain-modeling SKILL.md skill
j-star-films-studios/vibecode-protocol-suite · assets/.agent/skills/agent-engineering/domain-modeling/SKILL.md · Build and sharpen a project's domain model. Use when discussing codebase terminology, writing or editing a CONTEXT.md…
git:20260821.1b830a3 · audit A · 26 stars

Every file in j-star-films-studios/vibecode-protocol-suite

Other files named frontend-ui

frontend-ui SKILL.md skill
jnpiyush/agentx · .github/skills/design/frontend-ui/SKILL.md · Build frontend UIs with HTML5, CSS3, and Tailwind CSS following accessibility and performance best practices. Use when…
v1.0.0 · audit A · 18 stars
frontend-ui SKILL.md skill
arcanada-one/datarim · skills/frontend-ui/SKILL.md · Frontend UI checklist — CSS specificity, dark/light themes, visual testing, mobile responsiveness, i18n parity. Apply…
git:20261018.b3021ea · audit A · 16 stars

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