# Secret Sauce: what the installer does

The one-line install (paste it into any AI coding tool, or run it in a terminal):

```bash
curl -fsSL https://secretsauce.shinyrock.app/i | node -
```

Windows: `curl.exe -fsSL https://secretsauce.shinyrock.app/i | node -`. Needs Node.js 18 or newer
(https://nodejs.org). No git, no accounts. The script is plain JavaScript you can read first:
https://secretsauce.shinyrock.app/i

It finds the AI coding tools on the computer (Claude Code, Codex, Cursor, Gemini CLI, Windsurf, OpenCode,
VS Code / Copilot, and about 70 others the open `skills` CLI knows) and, for each one:

## 1. Skills (32), from their authors' own GitHub repos

| From | Skills |
| --- | --- |
| [anthropics/skills](https://github.com/anthropics/skills) | frontend-design |
| [nextlevelbuilder/ui-ux-pro-max-skill](https://github.com/nextlevelbuilder/ui-ux-pro-max-skill) | ui-ux-pro-max, design-system, ui-styling, design, brand, banner-design, slides |
| [Leonxlnx/taste-skill](https://github.com/Leonxlnx/taste-skill) | design-taste-frontend |
| [pbakaus/impeccable](https://github.com/pbakaus/impeccable) | impeccable |
| [heydamir/unslop](https://github.com/heydamir/unslop) | unslop |
| [benjitaylor/skills](https://github.com/benjitaylor/skills) | stageshow |
| [emilkowalski/skills](https://github.com/emilkowalski/skills) | animate, animate-expo, animation-performance, animation-vocabulary, apple-design, ask-sonner, break-ui, emil-design-eng, find-animation-opportunities, improve-animations, mobile-native, pick-ui-library, prototype, remove-animations, review-animations, write-swift |
| [Appllama/appllama-skills](https://github.com/Appllama/appllama-skills) | appllama-app-design-skill |
| [this site](https://secretsauce.shinyrock.app/kit/secret-sauce/SKILL.md) | secret-sauce (the playbook), ui-sources, bencho |

Each repo is downloaded as a snapshot and installed with `npx skills@1.7.5 add <folder> -g -y --copy`, which
puts the skills where each tool reads them (`~/.agents/skills`, `~/.claude/skills` and so on).

## 2. Libraries, saved once in `~/.secretsauce`

- `uiverse/`: the open-source Uiverse library ([uiverse-io/galaxy](https://github.com/uiverse-io/galaxy), MIT), about 3,800 plain HTML/CSS pieces.
- `bencho/`: Bencho's free blocks and UI sounds ([cabralorenzo/bencho](https://github.com/cabralorenzo/bencho), MIT).

## 3. Connectors (MCP servers)

- `magicui`: `npx -y @magicuidesign/mcp@latest`
- `boardui`: `npx -y boardui@latest mcp`
- `21st`, only when a key is given (`... | node - --21st-key=YOUR_KEY`, free key at https://21st.dev/mcp):
  HTTP `https://21st.dev/api/mcp` with the header `x-api-key`.

Where they're written: Claude Code (`claude mcp add --scope user`, or `~/.claude.json`), Codex
(`~/.codex/config.toml`), Cursor (`~/.cursor/mcp.json`), Gemini CLI (`~/.gemini/settings.json`), Windsurf
(`~/.codeium/windsurf/mcp_config.json`), OpenCode (`~/.config/opencode/opencode.json`), VS Code (its user
`mcp.json`). Each file is backed up once as `<file>.before-secretsauce` before the first change. A settings
file with comments in it is left alone and reported. Other tools: add the two servers above to its MCP settings.

## 4. One line in the global rules

Added once, between `<!-- secret-sauce -->` markers, to `~/.claude/CLAUDE.md`, `~/.codex/AGENTS.md`,
`~/.gemini/GEMINI.md`, Windsurf's `global_rules.md` and OpenCode's `AGENTS.md`:

> For any design or UI work, load the `secret-sauce` skill first and follow it.

## Afterwards

Everything shows up in **new** chats. Run the same line again any time to update. To remove it:
`npx skills remove -g`, delete `~/.secretsauce`, and delete the marked block and the `magicui`, `boardui` and
`21st` entries from the files above (or restore the `.before-secretsauce` copies).
