# How to Install Hallmark Design Skill in Claude Code, Cursor, and Codex > Easily install the Hallmark design skill in Claude Code, Cursor, and Codex. Use a simple npx command to add this powerful tool to your workflow. - Repository: [Hassan El Mghari/hallmark](https://github.com/Nutlope/hallmark) - Tags: how-to-guide - Published: 2026-07-31 --- **Install the Hallmark design skill across Claude Code, Cursor, and Codex using a single `npx skills add nutlope/hallmark` command that copies [`SKILL.md`](https://github.com/Nutlope/hallmark/blob/main/SKILL.md) and the `references/` directory into assistant-specific paths.** The Hallmark repository by Nutlope provides a self-contained design skill that eliminates AI-generated "slop" by enforcing macrostructure selection, theme rotation, and anti-pattern detection. This guide explains how to install Hallmark in Claude Code, Cursor, and Codex, covering both global and project-scoped configurations. ## Installation Paths by AI Assistant Hallmark installs into different directories depending on which assistant you use. The `npx skills add` command automatically selects the correct destination based on your environment. ### Claude Code (Global) For Claude Code, the skill installs into your home directory: ```bash ~/.claude/skills/hallmark/ ``` This global location makes Hallmark available across all projects when using Claude Code. ### Cursor (Project-Scoped) Cursor expects skills in a project-specific rules directory: ```bash .cursor/rules/hallmark.mdc ``` Unlike the other assistants, Cursor reads the skill from a single `.mdc` file rather than a directory structure. ### Codex (Personal) For personal, system-wide access in Codex: ```bash ~/.codex/skills/hallmark/ ``` This path functions identically to Claude Code's global installation, providing access across all repositories. ### Codex (Project-Scoped) For repository-specific installations in Codex: ```bash .codex/skills/hallmark/ ``` Use this when you want Hallmark rules available only within a specific project context. ## Step-by-Step Installation Guide Follow these steps to install the Hallmark design skill in your preferred AI coding assistant: 1. **Open a terminal** in your project root (or any location for personal/global installs). 2. **Execute the install command**: ```bash npx skills add nutlope/hallmark ``` 3. The package manager fetches `nutlope/hallmark` from npm and writes the files to the appropriate directory for your detected assistant. 4. **Verify the installation** by checking for the presence of [`SKILL.md`](https://github.com/Nutlope/hallmark/blob/main/SKILL.md) and the `references/` folder (or `.mdc` file for Cursor). ## Verifying Your Installation Confirm that Hallmark copied correctly by inspecting the target directories. For Claude Code: ```bash ls ~/.claude/skills/hallmark/ # Output: SKILL.md references/ ``` For Cursor: ```bash cat .cursor/rules/hallmark.mdc # Displays the content of SKILL.md embedded in Cursor's format ``` For Codex (personal): ```bash ls ~/.codex/skills/hallmark/ # Output: SKILL.md references/ ``` ## How Hallmark Works Under the Hood Hallmark operates as a **static set of markdown rules** requiring no runtime compilation or external services. The skill consists of two core components: - **[`SKILL.md`](https://github.com/Nutlope/hallmark/blob/main/SKILL.md)** – The primary definition file that each assistant reads at startup - **`references/`** – A collection of markdown files encoding design rules, including macrostructures, themes, anti-patterns, and verb specifications Each assistant discovers Hallmark by reading these files from their expected installation paths. The internal logic—including macrostructure selection from the 21 documented patterns, custom theme generation, and "slop-test" gating—executes entirely within the assistant's context window using the copied markdown content. Key reference files include: - [`references/verbs/audit.md`](https://github.com/Nutlope/hallmark/blob/main/references/verbs/audit.md) – Defines the audit behavior - [`references/verbs/redesign.md`](https://github.com/Nutlope/hallmark/blob/main/references/verbs/redesign.md) – Defines the redesign behavior - [`references/verbs/study.md`](https://github.com/Nutlope/hallmark/blob/main/references/verbs/study.md) – Defines the study behavior - [`references/macrostructures.md`](https://github.com/Nutlope/hallmark/blob/main/references/macrostructures.md) – Indexes available layout patterns - [`references/custom-theme.md`](https://github.com/Nutlope/hallmark/blob/main/references/custom-theme.md) – Handles palette and font generation logic ## Using Hallmark After Installation Once installed, invoke Hallmark inside your coding session using these commands: ```bash # Default design flow hallmark # Audit an existing page for design issues hallmark audit ./src/index.html # Redesign with a specific mood hallmark redesign ./src/main.css --mood playful # Study a URL or screenshot hallmark study https://example.com ``` The skill processes these verbs according to the specifications in `references/verbs/`, applying the anti-AI-slop rules defined in the Hallmark repository. ## Summary - **Single command installation**: Run `npx skills add nutlope/hallmark` to install across Claude Code, Cursor, and Codex. - **Path variations**: Claude Code uses `~/.claude/skills/hallmark/`, Cursor uses `.cursor/rules/hallmark.mdc`, and Codex uses either `~/.codex/skills/hallmark/` (personal) or `.codex/skills/hallmark/` (project). - **Core files**: The installation copies [`SKILL.md`](https://github.com/Nutlope/hallmark/blob/main/SKILL.md) and the `references/` directory (or converts to `.mdc` for Cursor) containing all design rules and verb specifications. - **Static execution**: Hallmark requires no compilation or external APIs; assistants execute the markdown rules directly from the copied files. - **Four verbs available**: Use `hallmark`, `hallmark audit`, `hallmark redesign`, and `hallmark study` to interact with the skill. ## Frequently Asked Questions ### What files are installed by the Hallmark skill? The installation copies [`SKILL.md`](https://github.com/Nutlope/hallmark/blob/main/SKILL.md) and the entire `references/` directory containing verb specifications ([`audit.md`](https://github.com/Nutlope/hallmark/blob/main/audit.md), [`redesign.md`](https://github.com/Nutlope/hallmark/blob/main/redesign.md), [`study.md`](https://github.com/Nutlope/hallmark/blob/main/study.md)), macrostructure definitions, and theme generation logic. For Cursor, these contents are embedded into a single `.mdc` file at `.cursor/rules/hallmark.mdc`. ### Can I use Hallmark in multiple AI assistants simultaneously? Yes. You can install Hallmark in Claude Code globally, in Cursor for specific projects, and in Codex for personal use without conflicts. Each assistant maintains its own copy of the skill files in their respective directories, allowing you to use Hallmark across different environments concurrently. ### Does Hallmark require an internet connection after installation? No. Hallmark functions entirely offline after installation. The skill comprises static markdown files that encode design rules and logic. Once `npx skills add nutlope/hallmark` copies these files to your assistant's skill directory, all processing happens locally within the AI assistant's context window without external API calls or services. ### How do I update the Hallmark skill to the latest version? Re-run the installation command `npx skills add nutlope/hallmark` to fetch the latest version from npm. This overwrites the existing [`SKILL.md`](https://github.com/Nutlope/hallmark/blob/main/SKILL.md) and `references/` files (or `.mdc` file for Cursor) with the current release. Verify the update by checking the file timestamps in your assistant's skill directory or reviewing the version notes in the repository.