Add new skills page (#45118)

Adds a new Skills page

<img width="642" height="1104" alt="CleanShot 2026-04-22 at 09 20 54"
src="https://github.com/user-attachments/assets/b1498f68-8779-4057-b8a2-e0b5a5298b4e"
/>

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Home hero now shows two side-by-side CTAs: "Get Started" and "Install
Skills" for quick access.

* **Documentation**
* Added a new "Skills" docs page describing Agent Skills and
installation options (CLI and plugin).
* Sidebar navigation updated: section renamed to "AI Skills" and the nav
item changed to "Skills" (marked new).

* **Removed**
  * Old "Prompts" documentation page removed.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

apps/ui-library/app/(app)/page.tsx

@@ -45,9 +45,14 @@ export default function Home() {
                       A collection of React components and blocks built on the shadcn/ui library
                       that connect your front-end to your Supabase back-end via a single command.
                     </h2>
-                    <Button_Shadcn_ variant="secondary" size="lg" className="mt-4">
-                      <Link href="/docs/getting-started/quickstart">Get Started</Link>
-                    </Button_Shadcn_>
+                    <div className="flex gap-3 mt-4">
+                      <Button_Shadcn_ variant="secondary" size="lg">
+                        <Link href="/docs/getting-started/quickstart">Get Started</Link>
+                      </Button_Shadcn_>
+                      <Button_Shadcn_ variant="outline" size="lg">
+                        <Link href="/docs/ai-editors-rules/skills">Install Skills</Link>
+                      </Button_Shadcn_>
+                    </div>
                   </div>
                 </div>
               </div>

apps/ui-library/config/docs.ts

@@ -25,13 +25,14 @@ export const gettingStarted: SidebarNavGroup = {
 }
 
 export const aiEditorsRules: SidebarNavGroup = {
-  title: 'AI Editors Rules',
+  title: 'AI Skills',
   items: [
     {
-      title: 'Prompts',
-      href: '/docs/ai-editors-rules/prompts',
+      title: 'Skills',
+      href: '/docs/ai-editors-rules/skills',
       items: [],
-      commandItemLabel: 'AI Editors Rules',
+      new: true,
+      commandItemLabel: 'AI Skills',
     },
   ],
 }

apps/ui-library/content/docs/ai-editors-rules/prompts.mdx

@@ -1,21 +0,0 @@
----
-title: Prompts
-description: Rules for AI Code Editors for Supabase
----
-
-## Installation
-
-<BlockItem name="ai-editor-rules" description="Rules for AI Code Editors for Supabase" />
-
-## Folder structure
-
-<RegistryBlock itemName="ai-editor-rules" />
-
-## Usage
-
-Running the install command above will add the rule to the `.cursor/rules` directory in your project. If you don't have a `.cursor/rules` directory, it will be created for you.
-
-Rules are project-specific, so you can have different rules for different projects depending on your needs. Rules are automatically included when matching files are referenced.
-
-If you're installing the rules in a monorepo, you'll need to move the `.cursor` directory at the
-root directory and update all paths in the `.mdc` files.

apps/ui-library/content/docs/ai-editors-rules/skills.mdx

@@ -0,0 +1,42 @@
+---
+title: Skills
+description: Agent Skills for Supabase — procedural knowledge and context that AI agents can load on demand
+---
+
+Agent Skills are folders of instructions, scripts, and resources that agents can discover and use to do things more accurately and efficiently. Skills give agents access to procedural knowledge and Supabase-specific context they can load on demand, so they can do real work reliably.
+
+Skills work with 18+ AI agents including Claude Code, GitHub Copilot, Cursor, Cline, and many others.
+
+## Installation
+
+Run these commands in the root of your project — skills are installed per-project, similar to how you'd add a config file or dev dependency. Once installed, your AI agent will automatically pick them up the next time it runs.
+
+Install all Supabase skills using the skills CLI:
+
+```bash
+npx skills add supabase/agent-skills
+```
+
+This installs the full set of Supabase skills — the right choice for most projects. If you're doing a lot of database work, also add the Postgres-specific skill:
+
+```bash
+npx skills add supabase/agent-skills --skill supabase-postgres-best-practices
+```
+
+The `supabase-postgres-best-practices` skill covers Postgres performance optimization, query design, and schema best practices. It's used automatically when writing, reviewing, or optimizing queries and database configurations.
+
+### Claude Code
+
+You can also install the skills as Claude Code plugins:
+
+```bash
+/plugin marketplace add supabase/agent-skills
+/plugin install supabase@supabase-agent-skills
+```
+
+## Learn more
+
+For the full list of available skills, installation options, and usage guidance, see the [Agent Skills documentation](https://supabase.com/docs/guides/getting-started/ai-skills).
+
+- [Agent Skills Repository](https://github.com/supabase/agent-skills)
+- [Agent Skills Documentation](https://agentskills.io/home)