frontend-quality SKILL.md skillA

frontend-quality from miosa-osa/osa is an agent skill: a SKILL.md folder an AI agent loads when a task calls for it.

Install it, pinned
mdr add miosa-osa/osa/frontend-quality@git:20260816.716d56b

Pins git:20260816.716d56b in mdr.lock. Pin the fingerprint instead.

Audit grade
A, 17 of 17 checks passed
Kind
SKILL.md skill
Repository
miosa-osa/osa
Path
priv/skills/frontend-quality/SKILL.md
Versions recorded
1
Latest version
git:20260816.716d56b, committed Aug 16, 2026
Size
1,712 bytes
Repository stars
78
License
Apache-2.0

Build, debug, review, or polish user interfaces with responsive layout, accessibility, and pixel-level visual verification. Use for frontend components, browser UI, terminal UI, resize defects, visual regressions, and interaction problems.

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 Quality

Treat the rendered interface as the product, not merely the source code.

## Procedure

1. Reproduce the current interface in the real browser, terminal, or device surface.
2. Capture the relevant viewport size, state, interaction, and screenshot.
3. Trace layout ownership before editing styles or rendering code.
4. Check narrow, typical, and wide sizes plus content extremes.
5. Preserve hierarchy, spacing rhythm, readable typography, and clear interaction states.
6. Verify keyboard use, focus, contrast, labels, and reduced-motion behavior where applicable.
7. Add an automated visual, component, PTY, or interaction regression when the harness supports it.
8. Re-run the original interaction and inspect the pixels directly.

## Resize and terminal interfaces

- Derive layout from the current frame size rather than stale cached dimensions.
- Keep one authoritative render path for initial draw and resize replay.
- Do not duplicate committed content while redrawing live regions.
- Verify rapid repeated resizes, not only one final resize event.
- Test narrow widths where wrapping changes row counts.

## Completion evidence
…

Read the whole file at its exact version.

How to install

The exact contents, by fingerprint
mdr add miosa-osa/osa/frontend-quality@sha256:59c7efc382dade92

The line at the top of this page pins the label git:20260816.716d56b, 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_dnncjixmojakmxp6.svg)](https://markdownregistry.com/a/art_dnncjixmojakmxp6)

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

Versions

The registry has recorded 1 version of this file, committed on Aug 16, 2026.

versioncommittedcommitsizeaudit
git:20260816.716d56b latest2026-08-16 716d56b 1,712 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 (1712 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

miosa-osa/osa · 78 stars · license Apache-2.0 · pushed 2026-10-29 · branch main

API

GET https://markdownregistry.com/api/v1/artifacts/art_dnncjixmojakmxp6
GET https://markdownregistry.com/api/v1/resolve?ref=miosa-osa/osa/frontend-quality
GET https://markdownregistry.com/api/v1/blob/59c7efc382dade92b19a14eeefaedb095d1a08a472abb40ca4027dd70bc3f412

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 miosa-osa/osa

AGENTS.md@canopy/backend AGENTS.md file
miosa-osa/osa · canopy/backend/AGENTS.md
git:20260322.d94d08a · audit A · 78 stars
code-review SKILL.md skill
miosa-osa/osa · examples/skills/code-review/SKILL.md · Analyze pull requests and diffs for bugs, security vulnerabilities, performance issues, style violations, and test…
git:20260319.dccc501 · audit A · 78 stars
content-writer SKILL.md skill
miosa-osa/osa · examples/skills/content-writer/SKILL.md · Draft blog posts, social media content, email campaigns, and marketing copy
git:20260319.dccc501 · audit A · 78 stars
customer-support SKILL.md skill
miosa-osa/osa · examples/skills/customer-support/SKILL.md · Triage incoming support tickets, draft responses, detect customer sentiment, suggest knowledge base articles, and track…
git:20260319.dccc501 · audit A · 78 stars
daily-briefing SKILL.md skill
miosa-osa/osa · examples/skills/daily-briefing/SKILL.md · Generate a morning business briefing with weather, calendar, news, and task priorities
git:20260319.dccc501 · audit A · 78 stars
email-assistant SKILL.md skill
miosa-osa/osa · examples/skills/email-assistant/SKILL.md · Triage inbox, flag urgent emails, summarize threads, and draft replies
git:20260319.dccc501 · audit A · 78 stars
meeting-prep SKILL.md skill
miosa-osa/osa · examples/skills/meeting-prep/SKILL.md · Research attendees, prepare talking points, and summarize previous interactions before meetings
git:20260319.dccc501 · audit A · 78 stars
research-assistant SKILL.md skill
miosa-osa/osa · examples/skills/research-assistant/SKILL.md · Conduct deep, multi-source research on technologies, companies, markets, and topics — synthesizing findings into…
git:20260319.dccc501 · audit A · 78 stars
sales-pipeline SKILL.md skill
miosa-osa/osa · examples/skills/sales-pipeline/SKILL.md · Monitor sales pipeline, track deals, send follow-up reminders, and forecast revenue
git:20260319.dccc501 · audit A · 78 stars
arsenal-tool-validation SKILL.md skill
miosa-osa/osa · priv/skills/arsenal-tool-validation/SKILL.md · Tool-arsenal validation and risk gating for offensive engagements: risk-tier classification of tools…
git:20260913.e13b6b8 · audit A · 78 stars
attack-simulation SKILL.md skill
miosa-osa/osa · priv/skills/attack-simulation/SKILL.md · Run cyber defense attack simulations against isolated lab targets, compare detection gaps, apply a lab patch and rerun…
v1.0.200 · audit A · 78 stars
code-review SKILL.md skill
miosa-osa/osa · priv/skills/code-review/SKILL.md · Analyze pull requests and diffs for bugs, security vulnerabilities, performance issues, style violations, and test…
git:20260430.84eced6 · audit A · 78 stars

Every file in miosa-osa/osa

Other files named frontend-quality

frontend-quality SKILL.md skill
taewooopark/motifcode · packages/cli/builtin-plugins/frontend-quality/skills/frontend-quality/SKILL.md · Build or refine a web interface with intentional visual hierarchy, responsive behavior, accessible controls and browser…
git:20260926.17b10b0 · audit A · 79 stars

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