Pour les devs / CLI & MCP
Ravox dans votre agent
Connectez Ravox UI à Claude, Codex, Cursor, VS Code, Lovable ou Windsurf. Votre agent trouve des composants de la communauté, récupère le code, installe le Ravox Kit et les blocs, et applique les thèmes, directement dans votre projet, sans copier-coller.
D'abord, une clé d'API. C'est gratuit et cela relie l'agent à votre compte. Avec elle, les commandes ci-dessous sont prêtes à l'emploi.
1.Enregistrez le serveur
Dans le terminal :
claude mcp add --transport http ravox https://ui.ravoxlabs.com/api/mcp --header "x-api-key: VOTRE_CLE"2.Ou gardez-le dans le projet, pour l'équipe
Dans un .mcp.json à la racine. Chaque personne met sa propre clé dans RAVOX_API_KEY.
.mcp.json
{ "mcpServers": { "ravox": { "type": "http", "url": "https://ui.ravoxlabs.com/api/mcp", "headers": { "x-api-key": "${RAVOX_API_KEY}" } } } }
3.Vérifiez
ravox apparaît comme connecté :
claude mcp list
Que demander
Trouver et utiliser un composant
“Cherche dans Ravox un toggle ludique en CSS et mets-le dans le pied de page des paramètres.”
Construire un écran avec le Kit
“Installe le bloc de connexion par téléphone du Ravox Kit dans app/entrar et adapte les textes pour ma clinique.”
Changer le thème du projet
“Applique le thème Boulangerie de Ravox dans globals.css et montre-moi ce qui a changé.”
Copier sans Tailwind
“Récupère le thème Journal de Ravox en CSS pur et crée un tema.css pour ce site statique.”
Appliquer un design acheté
“/mcp__ravox__usar-design fermento (dans Claude Code). Avec l'accès annuel, /mcp__ravox__escolher-design compare tous les designs avec le client.”
Les outils
Tous sont en lecture seule : rien ne change dans votre projet sans que vous le demandiez à l'agent. Les copies comptent dans les statistiques de l'auteur du composant.
- buscar_componentes
- Recherche des composants UI de la communauté (HTML + CSS ou Tailwind) par texte, catégorie ou technologie. Renvoie jusqu'à 24 résultats avec le slug ; utilisez ver_componente pour obtenir le code.
- ver_componente
- Renvoie le HTML et le CSS (ou le HTML avec classes Tailwind) d'un composant publié, par slug. Quand elle existe, la version dans l'autre technologie (CSS ⇄ Tailwind) est incluse.
- listar_kit
- Liste les composants React du Ravox Kit (une bibliothèque installée avec le CLI @ravox-ui/cli, API en anglais, sans Radix) avec la commande d'installation de chacun.
- ver_item_kit
- Affiche les props d'un composant du Ravox Kit, la commande d'installation et le code source du fichier créé par le CLI.
- listar_blocos
- Liste les blocs du Kit : des écrans complets prêts à l'emploi (dashboards, sidebars, connexion, inscription, graphiques, tarifs...) avec la route qu'ils reçoivent et la commande qui installe l'écran avec ses composants.
- listar_temas
- Liste les thèmes du Ravox Kit (intégrés et de la communauté) avec polices, couleur de marque et dimensions. Utilisez ver_tema pour obtenir le CSS.
- ver_tema
- Renvoie le CSS d'un thème : `tailwind` (variables Tailwind 4 et shadcn pour globals.css) ou `css` (CSS pur avec variables, styles de base et classes prêtes).
- listar_designs
- Liste les designs de landing page et de panneau admin de Ravox UI avec ce qu'il faut pour choisir celui qui convient à un client : type, niches, ton, public, couleurs, polices, « convient à » et « à éviter pour ». Ouvert à tous ; les fichiers (ver_design) sont réservés à qui a acheté le design ou a l'accès annuel.
- ver_design
- Renvoie les fichiers d'un design à appliquer au projet : DESIGN.md (les règles, à toujours suivre), sistema.css (tokens et composants), tokens.css et LEIA-ME.md ; demandez-en d'autres par nom dans `arquivos`. Réservé à qui a acheté le design ou a l'accès annuel.
Sans MCP
Le Ravox Kit s'installe aussi directement depuis le terminal (npx @ravox-ui/cli add, voir le guide d'installation), et le résumé du site pour les modèles de langage se trouve sur /llms.txt. Le CLI de Ravox (npx ravox) arrive bientôt.