Feat/docs landing page updates

.claude-plugin/marketplace.json

@@ -4,7 +4,7 @@
     "name": "Jonas Broms"
   },
   "metadata": {
-    "description": "Metaprompting plugins for Claude Code — structured workflows for design, coding, research, and more",
+    "description": "Metaprompting plugins for AI coding assistants — structured workflows for design, coding, research, and more",
     "version": "0.1.0",
     "pluginRoot": "./plugins"
   },

README.md

@@ -2,12 +2,12 @@
 
 [![npm version](https://img.shields.io/npm/v/create-metapowers.svg)](https://www.npmjs.com/package/create-metapowers)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
-[![Claude Code](https://img.shields.io/badge/Claude_Code-Plugin-CC785C?logo=anthropic&logoColor=white)](https://claude.ai/code)
+[![LLM Plugin](https://img.shields.io/badge/LLM-Plugin-CC785C?logo=anthropic&logoColor=white)](https://bromso.github.io/metapowers/)
 [![Codex CLI](https://img.shields.io/badge/Codex_CLI-Compatible-10A37F?logo=openai&logoColor=white)](https://github.com/openai/codex)
 [![OpenCode](https://img.shields.io/badge/OpenCode-Compatible-6366F1)](https://opencode.ai)
 [![Cursor](https://img.shields.io/badge/Cursor-Compatible-000?logo=cursor&logoColor=white)](https://cursor.com)
 
-Structured, repeatable workflows for digital production domains. **275+ skills across 16 domains** — powered by proven methodologies. Works with Claude Code, Codex CLI, OpenCode, and Cursor.
+Structured, repeatable workflows for digital production domains. **275+ skills across 16 domains** — powered by proven methodologies. Works with any AI coding assistant — Claude Code, Codex CLI, OpenCode, Cursor, and more.
 
 ## Quick Start
 
@@ -103,7 +103,7 @@ metapowers/
 ### Prerequisites
 
 - [Bun](https://bun.sh) >= 1.3
-- One of: Claude Code, Codex CLI, OpenCode, or Cursor
+- One of: Claude Code, Codex CLI, OpenCode, Cursor, or any SKILL.md-compatible assistant
 
 ### Setup
 

apps/docs/app/(home)/page.tsx

@@ -1,3 +1,6 @@
+"use client";
+
+import { useState } from "react";
 import Link from "next/link";
 import {
 	Palette,
@@ -174,8 +177,8 @@ const steps = [
 	{
 		number: "01",
 		title: "Install",
-		command: "claude install bromso/metapowers",
-		description: "Add all domains to Claude Code in one command.",
+		command: "npx create-metapowers",
+		description: "Add all domains in one command.",
 	},
 	{
 		number: "02",
@@ -191,6 +194,90 @@ const steps = [
 	},
 ];
 
+const installTabs = [
+	{ label: "npm", command: "npx create-metapowers" },
+	{ label: "pnpm", command: "pnpx create-metapowers" },
+	{ label: "yarn", command: "yarn dlx create-metapowers" },
+	{ label: "bun", command: "bunx create-metapowers" },
+	{ label: "Claude Code", command: "claude install bromso/metapowers" },
+	{ label: "Cursor", command: "cp metapowers/.cursorrules ./" },
+];
+
+function InstallTabs() {
+	const [activeTab, setActiveTab] = useState(0);
+	const [copied, setCopied] = useState(false);
+
+	function copyToClipboard() {
+		navigator.clipboard.writeText(installTabs[activeTab].command);
+		setCopied(true);
+		setTimeout(() => setCopied(false), 2000);
+	}
+
+	return (
+		<div className="w-full max-w-xl">
+			<div className="flex overflow-x-auto border-b border-fd-border">
+				{installTabs.map((tab, i) => (
+					<button
+						key={tab.label}
+						type="button"
+						onClick={() => setActiveTab(i)}
+						className={`shrink-0 px-4 py-2 text-sm font-medium transition-colors ${
+							i === activeTab
+								? "border-b-2 border-fd-primary text-fd-foreground"
+								: "text-fd-muted-foreground hover:text-fd-foreground"
+						}`}
+					>
+						{tab.label}
+					</button>
+				))}
+			</div>
+			<div className="relative rounded-b-lg border border-t-0 border-fd-border bg-fd-card p-4">
+				<code className="block text-sm text-fd-foreground">
+					<span className="text-fd-muted-foreground">$ </span>
+					{installTabs[activeTab].command}
+				</code>
+				<button
+					type="button"
+					onClick={copyToClipboard}
+					className="absolute right-3 top-3 rounded-md p-1.5 text-fd-muted-foreground transition-colors hover:bg-fd-accent hover:text-fd-foreground"
+					aria-label="Copy to clipboard"
+				>
+					{copied ? (
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							width="16"
+							height="16"
+							viewBox="0 0 24 24"
+							fill="none"
+							stroke="currentColor"
+							strokeWidth="2"
+							strokeLinecap="round"
+							strokeLinejoin="round"
+						>
+							<path d="M20 6 9 17l-5-5" />
+						</svg>
+					) : (
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							width="16"
+							height="16"
+							viewBox="0 0 24 24"
+							fill="none"
+							stroke="currentColor"
+							strokeWidth="2"
+							strokeLinecap="round"
+							strokeLinejoin="round"
+						>
+							<rect width="14" height="14" x="8" y="8" rx="2" ry="2" />
+							<path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" />
+						</svg>
+					)}
+				</button>
+			</div>
+		</div>
+	);
+}
+
 const skillManagement = [
 	{
 		icon: Radar,
@@ -256,14 +343,14 @@ export default function HomePage() {
 			<section className="flex flex-col items-center px-6 pb-16 pt-24 text-center md:pb-24 md:pt-32">
 				<div className="mb-6 inline-flex items-center gap-2 rounded-full border border-fd-border bg-fd-secondary/50 px-4 py-1.5 text-sm text-fd-muted-foreground">
 					<Zap className="h-3.5 w-3.5" />
-					<span>Claude Code plugins for structured workflows</span>
+					<span>LLM plugins for structured workflows</span>
 				</div>
 				<h1 className="mb-6 max-w-3xl text-5xl font-bold tracking-tight text-fd-foreground md:text-6xl lg:text-7xl">
 					Metapowers
 				</h1>
 				<p className="mb-10 max-w-2xl text-lg leading-relaxed text-fd-muted-foreground md:text-xl">
 					Structured workflows for every discipline — from design to legal.
-					Claude Code plugins powered by proven methodologies.
+					LLM-agnostic plugins that package skills, agents, and MCP to power proven methodologies.
 				</p>
 				<div className="flex flex-col gap-3 sm:flex-row sm:gap-4">
 					<Link
@@ -283,6 +370,9 @@ export default function HomePage() {
 						GitHub
 					</a>
 				</div>
+				<div className="mt-10 flex w-full justify-center">
+					<InstallTabs />
+				</div>
 			</section>
 
 			{/* Stats */}

apps/docs/content/docs/design/index.mdx

@@ -1,6 +1,6 @@
 ---
 title: Design Domain Overview
-description: A five-phase design thinking process for building UI components in Claude Code.
+description: A five-phase design thinking process for building UI components with AI coding assistants.
 ---
 
 The Design plugin implements a complete design thinking methodology with five phases. Each phase has a dedicated slash command that guides you through structured research, definition, ideation, prototyping, and testing.

apps/docs/content/docs/development/architecture/index.mdx

@@ -26,7 +26,7 @@ plugins/design/
 
 ## The Skill System
 
-Each skill is a Markdown file (`SKILL.md`) with YAML frontmatter and structured instructions. When you run a slash command like `/design:empathize button`, Claude Code loads the corresponding skill file and follows its instructions.
+Each skill is a Markdown file (`SKILL.md`) with YAML frontmatter and structured instructions. When you run a slash command like `/design:empathize button`, your AI coding assistant loads the corresponding skill file and follows its instructions.
 
 Skills define:
 - **Description** — what the skill does (used for matching)

apps/docs/content/docs/development/mcp-server/index.mdx

@@ -5,7 +5,7 @@ description: The @metapowers/figma-mcp server — a custom MCP server for Figma
 
 ## What is @metapowers/figma-mcp?
 
-`@metapowers/figma-mcp` is a Model Context Protocol (MCP) server that connects Claude Code to Figma. It provides 45 tools across 6 categories for reading design data, creating components, working with FigJam, managing Slides, and running accessibility audits.
+`@metapowers/figma-mcp` is a Model Context Protocol (MCP) server that connects your AI coding assistant to Figma. It provides 45 tools across 6 categories for reading design data, creating components, working with FigJam, managing Slides, and running accessibility audits.
 
 ## Architecture
 
@@ -15,7 +15,7 @@ The server communicates with Figma through two channels:
 - **Desktop Bridge Plugin** — for write operations (creating/modifying nodes via the Figma Plugin API)
 
 ```
-Claude Code <--stdio--> MCP Server <--REST API--> Figma API
+AI Assistant <--stdio--> MCP Server <--REST API--> Figma API
                               |
                               +--WebSocket--> Bridge Plugin <--Plugin API--> Figma Desktop
 ```

apps/docs/content/docs/development/mcp-server/setup.mdx

@@ -5,7 +5,7 @@ description: How to install and configure the @metapowers/figma-mcp server.
 
 ## Prerequisites
 
-- Claude Code CLI installed
+- An AI coding assistant (Claude Code, Codex CLI, etc.) installed
 - A [Figma personal access token](https://help.figma.com/hc/en-us/articles/8085703771159-Manage-personal-access-tokens)
 - Figma Desktop (for write operations via the Bridge Plugin)
 

apps/docs/content/docs/overview/companion-tools.mdx

@@ -1,6 +1,6 @@
 ---
 title: Companion Tools
-description: Complementary frameworks and tools that enhance your Claude Code experience alongside Metapowers.
+description: Complementary frameworks and tools that enhance your AI coding experience alongside Metapowers.
 ---
 
 > **Note:** These are third-party community and official tools — not maintained by the Metapowers project. Links and install commands were accurate at time of writing. Always check the source repository for the latest instructions.
@@ -11,7 +11,7 @@ Track token spend, session costs, and rate limits.
 
 ### ccflare
 
-Usage dashboard with a web UI — more visual than ccusage. Acts as a proxy between Claude Code and the Anthropic API with real-time analytics and intelligent load balancing.
+Usage dashboard with a web UI — more visual than ccusage. Acts as a proxy between your AI assistant and the Anthropic API with real-time analytics and intelligent load balancing.
 
 ```bash
 git clone https://github.com/snipeship/ccflare && cd ccflare
@@ -23,7 +23,7 @@ git clone https://github.com/snipeship/ccflare && cd ccflare
 
 ### ccusage
 
-CLI tool that analyzes Claude Code token usage and costs from local JSONL files. Supports daily, monthly, and session views. Privacy-first — no data leaves your machine.
+CLI tool that analyzes token usage and costs from local JSONL files. Supports daily, monthly, and session views. Privacy-first — no data leaves your machine.
 
 ```bash
 npx ccusage
@@ -114,7 +114,7 @@ Find and install community-built skills and plugins.
 
 ### skills.sh
 
-Skill marketplace and leaderboard run by Vercel. Supports 19+ AI agents including Claude Code. Tracks actual install counts. Uses the SKILL.md open standard.
+Skill marketplace and leaderboard run by Vercel. Supports 19+ AI agents. Tracks actual install counts. Uses the SKILL.md open standard.
 
 ```bash
 npx skills add owner/repo
@@ -126,7 +126,7 @@ npx skills add owner/repo
 
 ### awesome-claude-plugins
 
-Curated registry of production-ready Claude Code plugins by ComposioHQ. Includes the Composio Tool Router connecting Claude to 500+ external apps (Slack, GitHub, email, etc.).
+Curated registry of production-ready AI coding plugins by ComposioHQ. Includes the Composio Tool Router connecting Claude to 500+ external apps (Slack, GitHub, email, etc.).
 
 ```bash
 git clone https://github.com/ComposioHQ/awesome-claude-plugins
@@ -139,7 +139,7 @@ claude --plugin-dir ./connect-apps
 
 ### ClaudePluginHub
 
-Web directory for Claude Code plugins with semantic search and AI-powered relevance ranking. Can generate custom plugins from a GitHub URL.
+Web directory for AI coding plugins with semantic search and AI-powered relevance ranking. Can generate custom plugins from a GitHub URL.
 
 ```bash
 npx claudepluginhub owner/repo --plugin name

apps/docs/content/docs/overview/comparisons.mdx

@@ -1,11 +1,11 @@
 ---
 title: Comparisons
-description: How Metapowers compares to other Claude Code plugin ecosystems.
+description: How Metapowers compares to other AI coding plugin ecosystems.
 ---
 
 ## Metapowers vs. Other Plugin Ecosystems
 
-Several Claude Code plugin ecosystems exist. Here's how Metapowers differs.
+Several AI coding plugin ecosystems exist. Here's how Metapowers differs.
 
 ### vs. Superpowers (obra/superpowers)
 

apps/docs/content/docs/overview/index.mdx

@@ -1,20 +1,20 @@
 ---
 title: Getting Started
-description: What is Metapowers and how to get started with structured workflows in Claude Code.
+description: What is Metapowers and how to get started with structured workflows for AI coding assistants.
 ---
 
 ## What is Metapowers?
 
-Metapowers is a collection of Claude Code plugins that bring structured, repeatable workflows to digital production domains. Each plugin adds a set of slash commands that guide you through a proven methodology.
+Metapowers is a collection of LLM plugins that bring structured, repeatable workflows to digital production domains. Each plugin adds a set of slash commands that guide you through a proven methodology.
 
 The first plugin — **Design** — implements a five-phase design thinking process for building UI components, writing artifacts to Figma via MCP.
 
 ## Quick Start
 
-Install the metapowers marketplace in Claude Code:
+Install metapowers:
 
 ```bash
-claude install bromso/metapowers
+npx create-metapowers
 ```
 
 Then start a design workflow:

apps/docs/content/docs/overview/installation.mdx

@@ -1,6 +1,6 @@
 ---
 title: Installation
-description: How to install and configure Metapowers across Claude Code, Codex CLI, OpenCode, and Cursor.
+description: How to install and configure Metapowers across AI coding assistants.
 ---
 
 Metapowers works with multiple AI coding tools. Choose your tool below.

apps/docs/content/docs/overview/what-is-metapowers.mdx

@@ -1,6 +1,6 @@
 ---
 title: What is Metapowers
-description: An introduction to the Metapowers ecosystem — structured, domain-specific workflows for Claude Code.
+description: An introduction to the Metapowers ecosystem — structured, domain-specific workflows for AI coding assistants.
 ---
 
 ## The Problem
@@ -11,7 +11,7 @@ Teams need repeatable processes, not one-off prompts.
 
 ## What Metapowers Does
 
-Metapowers is a collection of Claude Code plugins that bring **structured, repeatable workflows** to digital production domains. Each plugin implements an established industry methodology as a set of slash commands.
+Metapowers is a collection of LLM plugins that bring **structured, repeatable workflows** to digital production domains. Each plugin implements an established industry methodology as a set of slash commands.
 
 Instead of writing a long prompt, you run:
 
@@ -61,4 +61,4 @@ Domains are aware of each other. The coaching plugin reads brand guidelines from
 - **Solo practitioners** who want structured workflows without a team
 - **Small teams** who need repeatable processes across disciplines
 - **Agencies** who want consistent methodology across client projects
-- **Anyone using Claude Code** who wants better output through better process
+- **Anyone using an AI coding assistant** who wants better output through better process

packages/create-metapowers/package.json

@@ -12,6 +12,8 @@
   },
   "keywords": [
     "metapowers",
+    "llm",
+    "ai-coding",
     "claude-code",
     "codex",
     "cursor",

packages/scoring-harness/src/runner.ts

@@ -3,7 +3,7 @@ import { readFileSync } from "node:fs";
 import { loadRubric, scoreOutput, type ScoreResult } from "./rubric.js";
 
 export function buildScoringPrompt(skillContent: string, fixtureContent: string): string {
-	return `You are scoring a Claude Code skill. Execute the skill instructions against the provided fixture input. Produce ONLY the skill output — no commentary, no explanation.
+	return `You are scoring a skill. Execute the skill instructions against the provided fixture input. Produce ONLY the skill output — no commentary, no explanation.
 
 ## Skill Instructions
 

plugins/metapowers/skills/find-skill/SKILL.md

@@ -18,7 +18,7 @@ None — utility skill, run anytime.
      - GitHub repositories with SKILL.md files
      - Claude Code plugin directories
      - Awesome lists for the relevant technology
-   - Search terms: "$ARGUMENTS SKILL.md", "$ARGUMENTS claude code skill", "$ARGUMENTS AI coding skill"
+   - Search terms: "$ARGUMENTS SKILL.md", "$ARGUMENTS LLM skill", "$ARGUMENTS AI coding skill"
 
 2. **Evaluate found skills:**
    - Does it have YAML frontmatter with a `description` field?