profile-cover

An agent skill that designs your GitHub profile README as an editorial page. The masthead you see above is the product: kerned Fraunces converted to SVG paths by the bundled scripts, light and dark pairs, zero external resources, so it renders identically through GitHub's image proxy on every OS and can never show a broken image.

한국어

Why not widgets

Most profile READMEs are a stack of third-party stats cards and badge rows. They rate-limit, they 503, they all look the same. profile-cover replaces the clutter with typography. Everything that should be a link stays plain markdown, so your pinned work is clickable, indexable, and theirs to keep loading forever.

Three archetypes ship with the skill. These strips are live SVGs rendered by GitHub right now, not screenshots:

Install

npx skills add sjh9714/profile-cover
pip install fonttools uharfbuzz

In fx: /skills install sjh9714/profile-cover --skill profile-cover

Then, in any session:

Design my GitHub profile README.

The agent interviews you, picks an archetype, generates the masthead and section strips with the bundled scripts, assembles a GitHub-native README.md, and runs the deterministic checker before you see anything.

What the checker enforces

• Accent colors come in light/dark pairs, both passing 4.5:1 contrast against GitHub's page colors
• No external resources in any SVG, no inline styles in the markdown (GitHub strips them), no empty table header rows
• No labels under 12.5px, the mobile legibility floor
• Warnings on decaying copy ("this week", live counts) unless paired with a refresh Action, and on third-party dynamic images

Sibling project

repo-cover designs the social preview card for a repository the same way. Same design language, same checker discipline.

License

MIT. Fraunces is bundled under the SIL Open Font License, see skills/profile-cover/assets/OFL.txt.