Agent Skills

What are Agent Skills?

Agent Skills provide structured knowledge about Nord Design System directly to AI coding agents. Once installed, your AI assistant understands Nord components, design tokens, CSS framework, and best practices — without needing to reference documentation manually.

Skills follow the Agent Skills Discovery RFC and work with 40+ AI coding agents including Claude Code, Cursor, Codex CLI, GitHub Copilot, Windsurf, Cline, Aider, and more.

Installation

Install the Nord skill using the npx skills CLI:

Copy code
npx skills add https://nordhealth.design

This fetches the skill from our well-known discovery endpoint and adds it to your project.

What the skill provides

The Nord skill gives your AI agent:

  • Component guidance — how to use all 55+ <nord-*> web components correctly
  • Design tokens — CSS custom property naming (--n-color-*, --n-space-*)
  • Styling approach — Tailwind CSS v4 with n: variant prefix
  • Theming — therapy/veterinary brands, dark mode, high contrast
  • Forms — native form participation, validation patterns
  • Accessibility — built-in ARIA, keyboard nav, screen reader support
  • Do/Don't rules — common mistakes to avoid
  • Documentation index — links to raw markdown for every component and guideline page

Supported agents

The npx skills CLI supports any agent that reads project-level skill files. This includes:

  • Claude Code
  • Cursor
  • Codex CLI
  • GitHub Copilot
  • Windsurf
  • Cline
  • Aider
  • Continue
  • And many more

See the full list at github.com/vercel-labs/skills.

Alternative: LLMs.txt

If your AI tool doesn't support agent skills, you can reference our documentation directly:

See the LLMs.txt page for tool-specific setup instructions.

Was this page helpful?

Yes No

We use this feedback to improve our documentation.