Skip to content

Bridge · #430

A badge that means something

Every one of the 289 components has a badge at /api/badge/<slug> — a real SVG carrying that asset's editorial quality score, coloured by band, with the accessibility score and the provenance written into the file's own description. It is not a CI badge: no pipeline runs behind it.

The three badges below are inlined SVG built by the same function that serves /api/badge/<slug>, so this page shows the real file without adding an image tag to the site — which is what keeps the image-free policy checkable rather than rhetorical.

Aurora Veil — quality 97/100 Aurora Veil: editorial quality 97/100, accessibility audit 100/100, from the Motif UI catalog. No CI service is involved; the score is the stored editorial value. motif quality motif quality 97 97

Aurora Veil

quality 97 · a11y 100 · 2.6 KB

[![Motif quality](https://<host>/api/badge/aurora-veil)](https://<host>/components/aurora-veil)
Tilt Card — quality 97/100 Tilt Card: editorial quality 97/100, accessibility audit 94/100, from the Motif UI catalog. No CI service is involved; the score is the stored editorial value. motif quality motif quality 97 97

Tilt Card

quality 97 · a11y 94 · 2.9 KB

[![Motif quality](https://<host>/api/badge/tilt-card)](https://<host>/components/tilt-card)
SaaS Launch Page — quality 97/100 SaaS Launch Page: editorial quality 97/100, accessibility audit 97/100, from the Motif UI catalog. No CI service is involved; the score is the stored editorial value. motif quality motif quality 97 97

SaaS Launch Page

quality 97 · a11y 97 · 24 KB

[![Motif quality](https://<host>/api/badge/saas-launch)](https://<host>/components/saas-launch)

What the badge reports

The editorial quality score from the catalog record — the same number printed on the asset page and in catalog.json. Bands are 90+ green, 75–89 amber, below 75 red, and the threshold is in the route's code rather than in a legend nobody reads.

The SVG carries a <desc> element naming the asset, both scores and the fact that no CI service is involved — so a screen reader, or anyone who opens the file, gets the provenance rather than a bare number.

Why this one is honest, and a CI badge usually is not

  • A “tests passing” badge on a project with no test suite is decoration. This badge reports a number the site already publishes per asset, so it cannot claim more than the catalog holds.
  • It updates when the catalog updates — with the caveat that the response is cached for five minutes at the edge, which is stated rather than promised as instant.
  • It cannot report compliance. A quality score is an editorial judgement with a published method, not a certification, and the badge says “motif quality” rather than anything resembling approval.