跳到主要内容
@unif/react-native-design

Unif 企业设计,
React Native 设计系统

由 Unif 维护的 React Native 组件库,提供基础组件、主题和图标,可供其他项目复用。

$npm install @unif/react-native-design
设计令牌亮 / 暗主题TypeScript
App.tsxThemeProvider
1import { useState } from 'react'
2import { Button, ThemeProvider }
3 from '@unif/react-native-design'
4 
5export function App() {
6 const [started, setStarted] = useState(false);
7 return (
8 <ThemeProvider forceScheme="dark">
9 <Button
10 label={started ? '已开始' : '开始使用'}
11 onPress={() => setStarted(true)}
12 />
13 </ThemeProvider>
14 );
15}
设计系统
Buttons
主要按钮次要
Tags
已完成进行中草稿
Cells
推送通知
实时接收拜访提醒
账户
王经理
组件实时预览
核心能力

基础组件

Cell / Button / Tag / Card / Switch / List 等高频组件,覆盖企业内表单与列表场景。

设计令牌

颜色、间距、圆角、阴影、动效全部令牌化,一处修改全局生效,与 Figma 变量对齐。

亮 / 暗主题

ThemeProvider 切换亮暗双主题,组件自动响应,无需手写两套样式。

无障碍

提供组件语义与无障碍属性;具体命中区域和读屏行为见各组件 API。