Design System
Next Level BuilderCovers design tokens in three layers, CSS variables, spacing and type scales, and component specifications.
By agent · Hermes
Skills in the open SKILL.md format that Hermes reads. Each one has a plain-language summary and the command to install it.
$ npx skills add <author>/<skill> --agent hermes-agentReplace the placeholder with the author and skill name from the skill's page. Start a new Hermes session afterwards so the skill is picked up.
Covers design tokens in three layers, CSS variables, spacing and type scales, and component specifications.
Covers brand identity, design tokens, UI styling, logo generation, HTML presentations and banners in one design skill.
Creates HTML presentations with Chart.js, design tokens, responsive layouts and copywriting formulas.
Builds accessible interfaces with shadcn/ui components and Tailwind CSS utility styling.
Migrates React projects and components from Radix UI to Base UI, including shadcn projects.
Manages shadcn/ui components and projects: add, search, fix, style and compose UI, with component docs and examples.
Controls a browser directly over CDP for automation, scraping, testing and screenshots.
QA-tests a website or web app in a browser and returns a 1–5 quality score with evidence.
Controls an isolated Browser Use Cloud browser from a sandboxed machine through the Browser Use CLI.
Writes a Conventional Commits message compressed to the intent of the change.
Compresses a memory file such as CLAUDE.md into caveman format to save input tokens, keeping a readable backup.
Explores a repository read-only to locate code across files and returns path and line citations.
Shows a quick-reference card of caveman modes, skills and commands.
Reviews a diff in compressed form: one line per finding with location, problem and fix.
Diagnoses an ambiguous failure before any edit, ranking hypotheses by evidence.
Builds a feature within strict scope, reusing what the repository already has and stopping at an explicit condition.
Implements schema, data, API or dependency migrations that are reversible, with rollback and preservation proof.
Restructures code while preserving behaviour, with verification before and after each structural edit.
Fixes a bug or small behaviour change at the narrowest responsible layer, with regression proof.
Proves that existing work meets its acceptance conditions without expanding scope.
Guides the design of stable APIs and module boundaries, covering REST and GraphQL endpoints and type contracts between modules.
Tests web apps in a real browser through Chrome DevTools MCP: inspect the DOM, read console errors, analyse network requests and profile performance.
Sets up and modifies CI/CD pipelines, including automated quality gates, test runners in CI and deployment strategies.
Runs a code review across several quality dimensions before a change is merged, whether the code came from you, a person or another agent.
Questions
Often. A skill is a folder of instructions and scripts in the open SKILL.md format, which Hermes reads. A skill that depends on tools only one agent provides will not carry over, so read the skill's source before you rely on it.
Each skill page has an install command. Run it in a terminal, then start a new Hermes session so the skill is picked up.
An instructions file is loaded in every session and describes the project. A skill is loaded only when a task calls for it, so it can be long and specific without costing context on every turn.