Set Up Avonni Agent Skills: The 10-Minute Guide

Start free

First, pick your tool

They all build the same thing

What changes is how much plumbing you touch. Every assistant below uses the same skills, the same server and the same Avonni components.

Best for non-developers

Claude desktop app

A normal desktop app, included with Claude Pro. Paste any command from this page into the chat and Claude runs it for you. You never open a terminal yourself.

Best in a terminal

Claude Code

The same skills and the same server, for people who already live in the terminal.

Best if you already use them

Cursor, VS Code, GitHub Copilot

Skills install with one command. The server goes in as a small JSON entry in your editor config.

Works, least tested

Gemini CLI

A chat that runs in a terminal window. Daily use is plain language like the others, but setup and troubleshooting are manual. Follow the Gemini CLI tab in each step.

The setup

Six steps, about ten minutes

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

I am using Claude Cursor, VS Code, Copilot Gemini CLI

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.

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.

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.

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

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

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.