Pinion UI
构建速度，没有上限。
同一份标记，300 多种样貌。转动 data-tune，形状、间距与字体一起变化；转动 data-theme，只有颜色改变。想试就试，重写的时间是零。
<h1>Balance is the default.</h1> <p class="lead">Set once, travels together.</p> <x-button color="primary" icon="rocket">Ship it</x-button> <x-badge color="success">Active</x-badge> <x-input label="Email" /> <x-progress :value="68" /> <x-rating :value="4" />
1430 种专业级设计
tune × theme = 种组合 — 当前显示 /
抢先获取新主题与新功能
Starter
¥2,980/月
适合个人及小型团队。包含基础组件套装。
Team
¥9,800/月
支持多项目、多人协作。含预设保存功能。
Enterprise
联系我们
含 SLA、专属支持与定制令牌设计的完整方案。
Starter
¥2,980/月
适合个人及小型团队。包含基础组件套装。
Team
¥9,800/月
支持多项目、多人协作。含预设保存功能。
Enterprise
联系我们
含 SLA、专属支持与定制令牌设计的完整方案。
Tune
同样的界面，不同的"留白"
只需切换 tune，空间设计就会改变。
Q. 明明是同样的组件，为什么整体印象却完全不同？
A. 圆角与阴影的表情，其实也在悄悄变化。
为 AI 代理而生
AI 代理能正确编写 pinion-ui
-
一次性阅读
AGENTS.md了解项目约定 -
AGENTS.md指导每个组件的查询工作流 -
reference/components/下有 46 份每组件参考文档 - 全新 Laravel 安装已验证 — 将包导入任何新应用，立即构建
60 秒快速安装
# 1. 添加包
composer require sparrowhawk-labs/pinion-ui
# 2. 安装资产 + AGENTS.md 脚手架
php artisan ui:install --ai
# 3. 构建 & 运行
npm run build && php artisan serve
加上 --ai 会将 AGENTS.md 放在你的 repo 根目录（并在 CLAUDE.md 中加入一行导入，供 Claude Code 使用）。
组件
46 个中的 9 个 — 从侧边栏选择任何组件查看完整矩阵<x-modal>
Modal
由 Alpine 驱动的对话框，带焦点陷阱、ESC 和背景关闭。
欢迎来到 pinion-ui
46 个组件，全部主题化，全部为 AI 代理编写文档。按 Esc 或点击外部关闭。
最新发布
所有发布文字与边框在任何主题下都是可读的深度
secondary / accent / neutral / info / success / warning / error 用于文字、边框、光环、进度条等"线条"时，现在与 primary 遵循同一规则，解析为 --pn-ink-<name>（110 个主题区块全部 ≥ 4.5:1）。text-warning 的黄色在浅色主题上偏向橄榄色，深色主题上的 text-neutral 变为可读的灰色；填充的 bg-warning 按钮保持黄色。同时去掉了 solid 面与 hover 时填充的 outline 面上的 1px 边缘（v0.23.1–0.23.2）。无需修改标记。
发布时间 — 2026-10
米白底色配可可色文字，再加上圆润饱满的黏土风调音——只需两个属性，就能做出亲切柔和的测验与表单
Mood 组新增 macaron / macaron-dark，调音新增 plush。macaron 为奶油色底（#F7F1E8）× 可可色文字，primary 为丹宁蓝、secondary 为鼠尾草绿、accent 为陶土色；plush 以 soft 为基础，圆角放大到约 22px，配上双层柔和阴影与 Fredoka / Nunito / M PLUS Rounded 1c 的圆体字。阵容增至 55 套主题 × 13 套调音，右上角的切换器会自动列出（现有主题与调音的数值不变）。
发布时间 — 2026-10
温暖的纸与墨 Tonal 主题——红色只作为警示灯出现，安静的界面里唯一的异常依然醒目
Tonal 组新增 signal / signal-dark：无彩色的暖纸（#F2F2EF）× 墨（#0D0D0D），primary / secondary 是比底色偏一级的纸色，accent 为深灰。唯一的红色（#E0322B）只用于 error 状态色，因此读起来是指示灯，而不是面或链接；暗色模式下纸与墨互换。主题阵容增至 54 套（亮/暗共 108 种），主题切换器自动列出。
发布时间 — 2026-09
抢先获取新主题与新功能
Pinion UI 的更新，以及开发中的框架 Laravel Sparrowhawk 的抢先体验。