c0le0ni/skills

 · 
coleoni.com
 · 
MIT License
The skills I use in my own workflow to ship projects, open and free. They work
in **Claude Code**, **Codex**, **Cursor**, **Gemini CLI** and any other agent
that reads SKILL.md.
Install
The installer lists the skills in this repository and asks which agents to add
them to. To skip the questions:
| I want | Command |
| --- | --- |
| A single skill | npx skills add c0le0ni/skills --skill coleoni-thumb |
| For my whole user, not just the project | npx skills add c0le0ni/skills -g |
| Claude Code only | npx skills add c0le0ni/skills -a claude-code |
| Codex only | npx skills add c0le0ni/skills -a codex |
| See the list without installing | npx skills add c0le0ni/skills --list |
It uses skills, Vercel's open skills
installer. Requires Node.js 22.20 or newer.
Skills
| Skill | What it does |
| --- | --- |
| /coleoni-thumb | Portfolio thumbnails and mockups from your project's real screens |
| /coleoni-briefing | Turns a client briefing into a decided scope, with a client-ready PDF |
| /coleoni-init | Sets up a new project's docs before any code, with a one-page overview |
| /coleoni-favicon | The complete favicon set from a logo, checked in tabs and home screens |
| /coleoni-og | Share images from your real pages, with the tags checked and every app previewed |
| /coleoni-launch | Checks a whole site before it goes live, with a verdict and screenshots |
| /coleoni-copy | Rewrites hype and vague copy into plain, specific text, in English or Portuguese |
| /coleoni-a11y | Accessibility audit for WCAG 2.2 AA and eMAG, with keyboard checks and a report |
| /coleoni-break | Breaks a component on purpose (long text, translation, 320px, 200% text…) and fixes it |
| /coleoni-states | Every state of a component, forced through its API: loading, empty, error, offline… |
| /coleoni-variants | Three real variations of a component, side by side in the page, to pick one |
| /coleoni-polish | Radii, shadows, spacing, buttons, icons and hover: the details that make it look finished |
| /coleoni-type | The type scale, fonts that never load, line height and length |
| /coleoni-color | Contrast, near-identical colors and an OKLCH palette with light and dark tokens |
| /coleoni-layout | Edges that almost line up, section rhythm and widths, drawn on the page |
| /coleoni-interface | The whole interface review in one pass: polish, type, color, layout, copy and a11y |
/coleoni-thumb
The skill opens the site, captures desktop and mobile, and sets the screens in
browser and phone frames on a background taken from the site's own palette.
Nothing is AI-generated: the image shows exactly what was shipped.
- **6 layouts:** split, devices, wall, phones, focus and tilt.
- **7 backgrounds:** auto, dark, brand, mesh, grid, blur or any hex color.
- **JPG at 1× and 2×**, in the size you ask for: 3:2, 16:9, 4:3, 4:5 feed or square.
- **Light or dark.** --scheme dark|light sets the color scheme the site opens
in. Light is the default; use dark for a site or app that is dark by default.
- **No browser download.** It uses the Chrome or Edge already on the machine.
The only package is playwright-core, which the agent installs on first use.
split · auto
devices · dark
wall · mesh
tilt · dark
Every image on this page was made by the skill itself.
See the full skill page.
/coleoni-briefing
Clients describe the product they imagine. Their answers reveal a smaller,
sharper problem. This skill reads everything the client sent (form answers,
call notes, emails, chat exports) and writes a scope you can defend.
- **One pain first.** The single problem that already justifies the project,
cited from the client's own answers.
- **What they already use stays out.** Each cut names the tool that already
does the job, so the client sees why.
- **First release, roadmap, open questions and a deadline check**, in a
ten-section document that reads in ten minutes.
- **Client-ready PDF.** --pdf renders a clean A4 document with your accent
color and logo, using the Chrome already on the machine.
The example is a fictional client brief for
Streak, my web game: WhatsApp messages and loose
notes asking for the game plus accounts, a global ranking, a daily challenge and a