SkillFoxx
Telegram

Скилл Bitrix24 UI для Vue и Nuxt

Bitrix24 UI

Официальный скилл Битрикс24 для более чем 130 компонентов b24ui-nuxt: когда какой компонент брать, семантические цвета, формы и готовые макеты

  • 44 ★ репозитория
  • Последний коммит
  • MIT
СкиллОфициальныйВыбор редакции

Минимальный доступ

Почему такой уровень

  • Только направляет генерацию UI-кода, не выполняет сетевые запросы и не трогает данные
  • Использует семантические цвета и компоненты сторонней библиотеки, ошибка максимум ломает верстку
Все причины и проверки
Российский стек

bitrix24/b24uiАвтор:Bitrix24

Установка

Сервисы

Ручная установка

npx skills add bitrix24/b24ui

Устанавливает скилл для всех поддерживаемых агентов в текущем проекте. Флаг --agent cursor или --agent claude-code ставит только для одного агента, --global делает скилл доступным во всех проектах.

Доступ и проверки

Как мы проверяем

Минимальный доступИнструмент ничего не запускает и не ходит в сеть.

  • Только направляет генерацию UI-кода, не выполняет сетевые запросы и не трогает данные
  • Использует семантические цвета и компоненты сторонней библиотеки, ошибка максимум ломает верстку

Это чужой код. Посмотрите файлы в репозитории перед установкой.

Что делает

Скилл b24-ui-nuxt учит агента строить интерфейсы на @bitrix24/b24ui-nuxt, библиотеке Vue-компонентов на Reka UI и Tailwind CSS для Nuxt, Vue, Laravel и AdonisJS. Он задает базовые правила: всегда оборачивать приложение в B24App, использовать только семантические цвета вроде text-description вместо сырых классов Tailwind, смотреть сгенерированные файлы темы для имен слотов. Дальше по таблице маршрутизации скилл подгружает только нужные справочники: выбор между похожими компонентами, конвенции кода, формы, иконки, готовые макеты дашборда и лендинга и рецепты вроде таблиц с фильтрами, оверлеев и форм настроек. За справкой по конкретным пропсам и слотам компонента скилл отправляет к llms.txt документации.

Для кого. Для фронтенд-разработчиков, которые строят Bitrix24-приложения или любой Vue-проект на компонентах b24ui.

Подходит, если

  • Собираете интерфейс приложения для Битрикс24 на Nuxt или Vue
  • Нужно решить, какой компонент подходит: модалка или боковая панель, выпадающий список или меню выбора
  • Нужны готовые макеты дашборда или лендинга на b24ui

Не подходит, если

  • Проект не использует @bitrix24/b24ui-nuxt: правила семантических цветов и слотов специфичны для этой библиотеки
  • Нужна документация по конкретному пропсу компонента: для этого стоит подключить отдельно llms.txt документации, а не сам скилл

Пример запроса к агенту

Собери страницу настроек Bitrix24-приложения с переключателями и карточками вариантов на компонентах b24ui

Ограничения

Скилл описывает только когда и какой компонент использовать, а не полный API пропсов и слотов: для этого нужно отдельно подключить llms.txt документации. Требует установленный @bitrix24/b24ui-nuxt и Tailwind CSS в проекте.

Как отключить. Удалите скилл через настройки агента, например пункт Skills в Cursor, или сотрите папку скилла из .claude/skills.

Частые вопросы

Скилл заменяет документацию компонентов?

Нет, он учит когда и какой компонент выбрать и как строить макеты, а за пропсами, слотами и событиями конкретного компонента отправляет к llms.txt документации.

Какие агенты поддерживает установка?

CLI skills.sh, которым устанавливается скилл, поддерживает более 35 агентов, включая Cursor, Claude Code, Codex, Windsurf и Cline.

Обсуждение

Вопросов и отзывов пока нет.

Битрикс24 — все инструменты
Официальный

Официальный стартовый Nuxt-дашборд Битрикс24 на b24ui с мок-данными и скиллом, который ведет разработку по архитектуре шаблона

СкиллМинимальный доступ2
Официальный

Семь официальных скиллов Битрикс24 для JS/TS SDK: выбор B24Hook, B24Frame или B24OAuth, REST-вызовы, фильтры, iframe-менеджеры и 12 готовых мини-приложений

СкиллРасширенный доступ18
Российский стек

Скилл для администрирования, диагностики и разработки коробочного Битрикс24 и Bitrix Framework по официальной документации

СкиллРасширенный доступ1
Официальный

Официальный шаблон MCP-сервера для Битрикс24 на Nuxt: готовые инструменты для задач и пользователей, три варианта развертывания

MCP-серверШирокий доступ6
Российский стек

CLI создает новый проект приложения для Bitrix24 из готовых шаблонов на Angular или Vue с их авторскими библиотеками для API

CLIРасширенный доступ6

Коротко о README

Страница документации Skills описывает разницу между скиллами и MCP-серверами, перечисляет темы скилла: установка для Nuxt, Vue, Laravel и AdonisJS, теминг, более 130 компонентов, composables, формы и макет дашборда. Показаны установка через CLI skills.sh с флагом --agent, быстрая установка в Cursor через диплинк и ручная настройка по URL.

Бейдж для README

Исходный SKILL.md

---
name: b24-ui-nuxt
description: Build UIs with @bitrix24/b24ui-nuxt v2 — 130+ accessible Vue components with Tailwind CSS theming. Use when creating interfaces, building forms, or composing layouts for a Bitrix24 application.
---

# 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 llms.txt; if it is not already configured, add it. This skill teaches when to use which component and how to build well.

## Core rules (always apply)

1. Always wrap the app in B24App — required for toasts, tooltips, and programmatic overlays. Accepts a locale prop for i18n.
2. Always use semantic colors — text-description, bg-elevated, border-muted, etc. Never use raw Tailwind palette colors like text-gray-500.
3. Read generated theme files for slot names — Nuxt: .nuxt/b24ui/<component>.ts, Vue: node_modules/.b24ui-nuxt/b24ui/<component>.ts.
4. Override priority (highest wins): b24ui prop / class prop -> global config -> theme defaults.
5. Find icons through the icons guideline — it maps a plain-language request to the right import.

Сообщить о проблеме