内容与数据展示 · 18 个词条
精选三条城市周边轻徒步路线，适合新手，全程约两小时。
把一张图、一段字、几个按钮装进一个带边框的盒子里，就是一张卡片。
一行一个条目竖着排下来，像聊天记录、歌单那样，适合快速上下扫。
行和列交叉成的数据格子，每条数据一行，适合对比、排序和批量操作。
贴在内容上的彩色小签，几个字的分类或关键词，有的能点、有的能删。
趴在图标右上角的小红点或数字，提醒你有几条没看的消息。
代表用户的小圆图，有照片显示照片，没照片就显示名字首字或默认图。
一种以自然语言驱动、AI 辅助生成代码的开发方式。
默认只露标题的一摞面板，点开才展开看详情，再点一下就收回去。
几张图轮流占同一个位置，自动翻或用手滑，首页 Banner 最爱用它。
消息会出现在这里
啥内容都没有时展示的友好页面：一张插画加一句话，再给个行动按钮。
访问量
12,480
+12%
转化率
3.2%
-3%
把关键数字放大加粗秀出来，常配涨跌箭头，是看板首页的顶梁柱。
点缩略图后全屏黑底看大图的弹层，能左右翻页，点黑的地方就关掉。
悬停可暂停滚动
一行字或一排 logo 不停往一边滚，首尾接上循环播，不用人动手。
上一段内容：设计令牌的命名规范。
下一段内容：组件状态与交互反馈。
内容分隔 hr
菜单分组 separator
行内分隔
内容块之间那条细细的灰线，把上下左右的内容轻轻分开，省得留白太多。
订单详情
用一列标题配一列内容的方式展示详情信息，比如订单号、状态、创建时间。
今日进度
提交需求
需求单已创建
视觉评审
设计师确认样式方向
组件开发
正在接入真实交互
按时间先后把事件串起来展示的组件，适合物流轨迹、版本记录、操作日志。
产品预览图
固定比例 + 加载占位
在界面里展示图片资源的基础组件，常带占位、懒加载、裁切和预览能力。
图标集
用简化图形表达操作、对象或状态的视觉符号，通常和文字一起使用。
适合设计师、前端和刚开始用 AI 做页面的人，用来把大白话需求翻成准确控件名。
把用户最常问的问题和答案集中排在一起的内容区块，通常会配合折叠展开，帮助用户快速自助解决疑问。
