#认识 Leaf UI

Leaf UI 是一个轻盈、自然、可定制的 React 组件库。以绿色为起点，让组件融入你的产品，也保留你的个性。

#轻盈自然

克制的色彩、舒适的圆角和清晰的交互状态，让内容成为主角。你可以直接使用默认的绿色主题，也可以调整主题色，让组件与品牌保持一致。

#可定制

通过 ConfigProvider 调整颜色、基础圆角、控件高度、字体与动效。大小尺寸自动生成，同一页面可以使用不同区域主题；业务组件也能读取主题变量复用样式。

#熟悉的使用方式

组件支持 React 18 / 19，提供 TypeScript 类型，保留原生 HTML 属性与 DOM ref。你可以沿用 React 中处理事件、表单与状态的方式。

#一致的基础组件

提供常用输入、选择、日期时间、表单、菜单、弹窗和反馈组件。可在组件总览中浏览所有组件。

图标使用 lucide-react，你也可以将自己的 React 图标节点传给组件。

#照顾每一次交互

组件包含键盘焦点、禁用与加载状态，并响应减少动态效果的系统偏好。只有图标的按钮需要设置 aria-label，为辅助技术提供清晰的名称。

选择菜单、日历、时间和级联面板都沿用相同的主题，可以使用键盘选择、清除或收起。面板在页面边缘自动避让，并继承局部容器的主题变量。

#从这里开始

先阅读安装和快速开始，再前往组件总览找到需要的组件。

如果希望调整颜色和圆角，可以直接使用主题编辑器。