Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add skills/bitrix24/b24ui/b24-ui-nuxtnpx skills add bitrix24/b24ui --skill b24-ui-nuxtgit clone --depth 1 https://github.com/bitrix24/b24uiWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/bitrix24/b24ui/b24-ui-nuxt)<a href="https://agentmods.dev/skills/bitrix24/b24ui/b24-ui-nuxt"><img src="https://agentmods.dev/badge/skills/bitrix24/b24ui/b24-ui-nuxt.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.00055 | $0.01744 |
| Opus 5 | $0.00028 | $0.00872 |
| Sonnet 5 | $0.00011 | $0.00349 |
| Haiku 4.5 | $0.00006 | $0.00174 |
Grade A, and why
b24-ui-nuxt scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 5d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 159 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Bitrix24 UI
Vue component library built on Reka UI + Tailwind CSS + Tailwind Variants. Works with Nuxt, Vue (Vite), Laravel (Vite + Inertia), and AdonisJS (Vite + Inertia).
LLMs.txt
When you need to know what a component accepts or how its API works — props, slots, events, full documentation, examples — use the Bitrix24 UI documentation; if it is not already configured, add it. This skill teaches you when to use which component and how to build well.
Core rules (always apply)
- Always wrap the app in
B24App— required for toasts, tooltips, and programmatic overlays. Accepts alocaleprop for i18n. - Always use semantic colors —
text-description,bg-elevated,border-muted, etc. Never use raw Tailwind palette colors liketext-gray-500. - Read generated theme files for slot names — Nuxt:
.nuxt/b24ui/<component>.ts, Vue:node_modules/.b24ui-nuxt/b24ui/<component>.ts. These show every slot, variant, and default class for any component. - Override priority (highest wins):
b24uiprop /classprop → global config → theme defaults. - Find icons through the icons guideline — it maps a plain-language request to the right import.
How to use this skill
Based on the task, load the relevant reference files before writing any code. Don't load everything — only what's needed.
Reference files
Guidelines — design decisions and conventions:
- design-system — semantic colors, theming, brand customization, variants, the
b24uiprop - component-selection — decision matrices: when to use Modal vs Slideover, Select vs SelectMenu, Toast vs Alert, etc.
- conventions — coding patterns, slot naming, items arrays, composables, keyboard shortcuts
- forms — form validation, field layout, error handling, Standard Schema
- icons — import icon and use it
What ships with it
15 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
- references/components.md 19 KB
- references/guidelines/component-selection.md 10 KB
- references/guidelines/conventions.md 9.1 KB
- references/guidelines/design-system.md 5.6 KB
- references/guidelines/forms.md 15 KB
- references/guidelines/icons.md 1.5 KB
- references/layouts/dashboard.md 6.6 KB
- references/layouts/landing.md 3.3 KB
- references/recipes/card-pickers.md 7.1 KB
- references/recipes/data-tables.md 6.8 KB
- references/recipes/detail-panel.md 7.4 KB
- references/recipes/navigation.md 1.5 KB
- references/recipes/overlays.md 21 KB
- references/recipes/settings.md 8.9 KB
- references/recipes/task-form.md 13 KB
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 5d ago First seen · 159 lines · 55 tokens per session scan A bfc9af9e6192
b24-ui-nuxt is a skill published in the GitHub repository bitrix24/b24ui (41 stars, last pushed 5d ago), licensed MIT. It adds 55 tokens to every session and 1,744 once invoked, about $0.0003 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
enforce-rules-for-unocss
Enforce AIRI's UnoCSS, Vue styling, shared UI component, animation, icon, and color-mode practices. Use when creating, editing, refactoring, or reviewing Vue templates, component styles, utility classes, UnoCSS configuration, animations, icons, UI primitives, packages/ui components, or VueUse dark-mode behavior in the…
shadcn-svelte
Pre-built shadcn-svelte components for json-render Svelte apps. Use when working with @json-render/shadcn-svelte, adding standard UI components to a Svelte catalog, or building Svelte web UIs with shadcn-svelte + Tailwind CSS components.
vue-components
Build Vue 3 components with TypeScript and Tailwind using clean structure, composable logic, accessibility, and maintainable patterns.
shadcn-svelte
Manages shadcn-svelte components and projects — adding, updating, fixing, debugging, styling, and composing UI. Provides project context, component docs, and usage examples. Applies when working with shadcn-svelte, the CLI, design-system presets, or any project with a components.json file. Also triggers for…
nuxt-ui
Build UIs with @nuxt/ui v4 — 125+ accessible Vue components with Tailwind CSS theming. Use when creating interfaces, customizing themes to match a brand, building forms, or composing layouts like dashboards, docs sites, and chat interfaces.
markstream-svelte
Integrate the beta markstream-svelte package in Svelte 5 or SvelteKit apps. Use when Codex needs Svelte 5 runes, CSS and optional peers, smooth streaming, worker setup, renderer-local or scoped custom components, or SSR-safe boundaries. Svelte 4 is unsupported.