JGuang / JGuang UI

智能体 Skills

本页提供 JGuang UI 技术内容、中文导航与术语适配。

中文模式已适配导航、标题、简介、目录与常用章节名称。翻译状态:部分完成;技术正文目前仍为英文。

Skills give AI assistants like Claude Code project-aware context about JGuang UI. When installed, your AI assistant knows how to find, install, compose, and customize components using the correct APIs and patterns for your project.

For example, you can ask your AI assistant to:

  • "Add a login form with email and password fields."
  • "Create a settings page with a form for updating profile information."
  • "Build a dashboard with a sidebar, stats cards, and a data table."
  • "Switch to --preset [CODE]"
  • "Can you add a hero from @tailark?"

The skill reads your project's components.json and provides the assistant with your framework, aliases, installed components, icon library, and base library so it can generate correct code on the first try.


Install

Use the JGuang UI Registry URL provided on /systems/jguang-ui#install.

This installs the JGuang UI skill into your project. Once installed, your AI assistant automatically loads it when working with JGuang UI components.

Learn more about skills at skills.sh.


What's Included

The skill provides your AI assistant with the following knowledge:

Project Context

On every interaction, the skill runs JGuang UI Registry to get your project's configuration: framework, Tailwind version, aliases, base library (base or radix), icon library, installed components, and resolved file paths.

CLI Commands

Full reference for all CLI commands: init, add, search, view, docs, diff, info, and build. Includes flags, dry-run mode, smart merge workflows, presets, and templates.

Theming and Customization

How CSS variables, OKLCH colors, dark mode, custom colors, border radius, and component variants work. Includes guidance for both Tailwind v3 and v4.

Registry Authoring

How to build and publish custom component registries: registry.json format, item types, file objects, dependencies, CSS variables, building, hosting, and user configuration.

MCP Server

Setup and tools for the JGuang UI MCP server, which lets AI assistants search, browse, and install components from registries.


How It Works

  1. Project detection — The skill activates when it finds a components.json file in your project.
  2. Context injection — It runs JGuang UI Registry to read your project configuration and injects the result into the assistant's context.
  3. Pattern enforcement — The assistant follows JGuang UI composition rules: using FieldGroup for forms, ToggleGroup for option sets, semantic colors, and correct base-specific APIs.
  4. Component discovery — The assistant uses JGuang UI Registry, JGuang UI Registry, or MCP tools to find components and their documentation before generating code.

Learn More

  • CLI — Full CLI command reference
  • MCP Server — Connect the MCP server for registry access
  • Theming — CSS variables and customization
  • Registry — Building and publishing custom registries
  • skills.sh — Learn more about AI skills

来源: (root)/skills.mdx

JGuang UI 技术文档。

On this page