Rabee股份有限公司（总部：东京都涩谷区，代表董事：上松勇喜）针对其Svelte × Tailwind CSS UI组件集「Rabee UI」进行了更新，包括添加范例和刷新颜色定义。 包括本次更新在内的所有49种Rabee UI组件，皆可从以下链接确认。 Rabee UI 官方文档 ■ 什么是Rabee UI？ Rabee UI是一个以Svelte和Tailwind CSS建构的UI组件集，其设计理念是作为可供客制化的「组件种子」。通过针对每个产品自由客制化颜色、字体和动画，开发团队能够以较低的成本创建具品牌特色的设计系统。 ■ Rabee UI的特点 ・Svelte × Tailwind CSS，提供灵活的客制化功能 ・可通过拷贝粘贴方式导入组件 ・支持深色模式和浅色模式 ・设计考量日语使用情境 ・提供与代码一致的Figma设计档 ■ 添加4种有助于创建管理接口和SaaS的范例 自2025年5月文档页面发布以来，Rabee UI持续每月更新。本月添加了「Admin Layout」、「Authentication」、「Error Layout」和「Header Snippet」四种范例。这些范例皆旨在支持产品开发中频繁使用的页面建构。 Admin Layout是包含侧边栏和页眉的通用管理接口布局范例。Authentication提供了登录和注册所需的页面范例。Error Layout提供了404（页面不存在）和500（服务器错误）等错误页面范例。Header Snippet是Web服务中易于使用的页眉范例。 Admin Layout https://rabeeui.com/docs/samples/adminlayout Authentication https://rabeeui.com/docs/samples/authentication Error Layout https://rabeeui.com/docs/samples/errorlayout Header Snippet https://rabeeui.com/docs/samples/header 范例 / Admin Layout, Header Snippet 范例 / Authentication, Error Layout ■ 将现有组件「Badge」和「Dialog」重构为「Chip」和「Modal」 现有组件中的两种已更新，使其在实际应用中更具实用性。 「Badge」更新为「Chip」 原先提供的「Badge」组件已更名为「Chip」，并扩充了颜色和视觉样式的种类。现在可以根据状态显示或标签显示等用途，灵活选择设计。 Chip https://rabeeui.com/docs/components/chip 组件 / Chip 「Dialog」更新为「Modal」 原先提供的「Dialog」组件已更名为「Modal」，并重新审视了设计。过去的Dialog在一个组件中同时提供了模态窗口功能和对话框显示功能。新的Modal将组件功能专注于「作为模态窗口显示」，使得模态窗口上显示的内容可以自由变更。这使其可用于各种模态窗口应用。 Modal https://rabeeui.com/docs/components/modal 组件 / Modal ■ 颜色定义全面刷新 Rabee UI提供的颜色变量命名已全面刷新。通过整理使其用途和层次更为明确，更容易在代码中找到目标变量。同时，也添加了Input类组件的边框颜色，以及键盘操作时显示的焦点环颜色。新的CSS内容可在以下文档中查看： Rabee UI 设置步骤 https://rabeeui.com/docs/setup