UI 组件 L1 · 组件分类 / Foundations & Visual Primitives
基础视觉与设计要素
颜色、排版、间距、图标、网格、分隔线和层级等构成界面的基础视觉与结构语言。
关键字段
Identity · 身份
- 子类型
- UI 组件分类
- 层级
- L1 · UI 组件分类
What · 是什么
- 定义
- 颜色、排版、间距、图标、网格、分隔线和层级等构成界面的基础视觉与结构语言。
- 分类
- 已验证
Why · 为什么
- 核心问题
- 界面的视觉语言和几何规则由什么组成?
Lifecycle · 生命周期
- 状态
- 已验证
包含 UI 组件类型(L2)
关系来自本地关系表,并包含反向关联。
- BorderBorder反向 · 属于
定义边界、分隔和层级的线性视觉元素。
- RadiusBorder Radius反向 · 属于
表达容器和控件边界的圆角规则。
- ColorColor反向 · 属于
提供色板与颜色角色的基础说明,不作为业务组件直接消费。
- ElevationElevation反向 · 属于
定义阴影、层级和 z-index 的基础尺度。
- Focus IndicatorFocus Indicator反向 · 属于
以可见方式标识当前键盘或辅助技术焦点。
- GridGrid反向 · 属于
定义容器、列、间隙和阅读宽度等布局基础。
- MotionMotion反向 · 属于
定义动效时长、缓动、位移和 reduced motion 基础规则。
- ProviderProvider反向 · 属于
为组件树提供主题、语言、方向、数据或交互上下文的基础机制。
- SpacingSpacing反向 · 属于
提供空间尺度和布局间距的基础说明。
- TypographyTypography反向 · 属于
定义字体家族、字号、字重、行高和字距的基础尺度。
- Visually HiddenVisually Hidden反向 · 属于
保留可访问名称或辅助技术信息,同时将视觉内容从布局中隐藏。
- DividerDivider反向 · 属于
分隔内容区域,表达结构关系而非装饰。
- Focus RingFocus Ring反向 · 属于
统一表达键盘焦点和当前交互目标的视觉轮廓。
- IconIcon反向 · 属于
表达操作、对象、状态或方向的视觉符号。
- Visually Hidden TextVisually Hidden Text反向 · 属于
只为辅助技术或上下文提供说明而不显示在视觉布局中的文本。