Set Up Avonni Agent Skills: The 10-Minute Guide

Start free

The setup

Six steps, about ten minutes

Do them in order. After the last one you never come back to this page.

Which assistant are you setting up?The steps below follow your choice.

ClaudeDesktop app or Claude Code✓

Cursor, VS Code, CopilotIn your code editor✓

Agentforce VibesSalesforce's own agent✓

Gemini CLIIn a terminal✓

Install Avonni in your org

2 min

Any package works, they all carry the same library. Ten free production licenses, sandboxes unlimited.

Start free

The install runs in your org and Salesforce emails you when it is done. Carry on with step 2 while it finishes.

Get the foundation ready

4 min

Two installs power everything. Without them your assistant can read documentation, but it cannot build, save or deploy anything.

Install Node.js, version 18 or later. Download, run the installer, accept the defaults.

Install the Salesforce CLI, then connect it to your org:

sf org login web

Copy

This opens a browser window where you log in to Salesforce as usual. The CLI then acts on your behalf.

Not a developer?

Both install like any other desktop app. And from here on you never need a terminal: paste any command on this page into the Claude desktop app chat and Claude runs it for you. You just approve.

Open a project folder

1 min

Your assistant works inside a folder on your computer, where it saves what it creates. Any empty folder works. An Avonni AI folder on your Desktop is fine.

Claude

Claude desktop app or Claude Code: open the folder as your project.

Cursor, VS Code, Copilot

File, then Open Folder.

Agentforce Vibes

In VS Code, open a Salesforce DX project with the Agentforce Vibes extension installed. Or open it in the browser from the Setup menu of your org, and pick Standard when it asks you to set up a project.

Gemini CLI

Install it, then run it from inside the folder.

npm install -g @google/gemini-cli

Copy

Install the Avonni Skills

1 min

One command installs all five skills into the folder you just opened. The installer detects your assistant and puts them in the right place.

npx skills add avonni/skills

Copy

Claude

Run it in the terminal, or paste it into the Claude chat and ask Claude to run it for you.

Cursor, VS Code, Copilot

Run it in your editor integrated terminal, from the folder you opened in step 3.

Agentforce Vibes

The skills installer does not know Vibes yet. Vibes reads project skills from .vibes/skills, so this command copies all five there:

npx degit avonni/skills/skills .vibes/skills

Copy

Run it in the Vibes terminal, or paste it into the Vibes chat and let the agent run it. Then open Toolkit, then Skills: the five Avonni skills appear under Project.

Gemini CLI

Run it from your project folder. Inside a Gemini session, check with /skills list, and run /skills reload if you just added them. If nothing appears, trust the folder with /trust and restart: Gemini only loads workspace skills from trusted folders.

Connect the Avonni MCP server

1 min

The server is hosted by Avonni. Nothing to install and nothing to run: you just point your assistant at it.

Claude

claude mcp add --transport http avonni https://mcp.avonnicomponents.com

Copy

Run it, or paste it into the chat the same way as step 4.

Cursor, VS Code, Copilot

https://mcp.avonnicomponents.com

Copy

Add it as an MCP server in your editor JSON config, for example .cursor/mcp.json.

Agentforce Vibes

In the Agentforce Vibes panel, open Toolkit, then MCP Servers, and click + Add Server. Name it avonni and paste this URL:

https://mcp.avonnicomponents.com

Copy

Click Add Server. A green Connected status with a tool count means it worked.

Gemini CLI

Add the server to your project .gemini/settings.json, creating the file if needed. Restart Gemini, then run /mcp to confirm the server is connected and its tools are listed.

Test it, then build

1 min

Ask your assistant:

List the available Avonni components.

Copy

A real list back, one catalog per Salesforce surface, means everything is connected. Now describe your first screen.

Claude

List the available Avonni components.

Avonni MCP ~~list_components~~ ✓

Here is what the Avonni catalog exposes, one per Salesforce surface:

Dynamic Components Lightning pages

Flow Screen Components Screen flows

Experience Components Portals and sites

LWC Components Your own code

Reply to Claude…

avonni-org

MCP: avonni

List the available Avonni components.

avonni ~~list_components~~ ✓

Here is what the Avonni catalog exposes, one per Salesforce surface:

Dynamic Components Lightning pages

Flow Screen Components Screen flows

Experience Components Portals and sites

LWC Components Your own code

Ask anything, ⌘K to open the command palette

Agentforce VibesAgent

List the available Avonni components.

MCP ~~list_components~~ ✓

Here is what the Avonni catalog exposes, one per Salesforce surface:

Dynamic Components Lightning pages

Flow Screen Components Screen flows

Experience Components Portals and sites

LWC Components Your own code

Ask Agentforce Vibes

avonni-orgAvonni MCP

gemini — ~/avonni-ai

GEMINI

List the available Avonni components.

list_components (avonni MCP) ✓

Here is what the Avonni catalog exposes, one per Salesforce surface:

Dynamic Components Lightning pages

Flow Screen Components Screen flows

Experience Components Portals and sites

LWC Components Your own code

Type your message or @path/to/file

A connected assistant answers with the real catalogs, one per Salesforce surface.

Set it up once. Then just describe what you want.

They all build the same thing

Claude desktop app

Claude Code

Cursor, VS Code, GitHub Copilot

Agentforce Vibes

Gemini CLI

Six steps, about ten minutes

Install Avonni in your org

Get the foundation ready

Open a project folder

Install the Avonni Skills

Connect the Avonni MCP server

Test it, then build

Nothing is deployed automatically.

Three things that fix almost everything

It answers from memory

The skills are not there

It builds but nothing saves

Start with one of these

That is the whole setup

Start free.

See it live.

Go deeper.