Files
inkreach-uni/设计规格说明.md
T
2026-08-21 17:10:36 +08:00

30 KiB
Raw Blame History

印美达小程序设计规格说明 (uniapp)

由 Figma API 自动提取,基于 inkreach 设计稿 设计稿宽度:390pxuniapp 中使用 rpx 适配,390px = 750rpx,即 1px = 1.923rpx

目录

全局设计规范

颜色规范

颜色 用途示例
#000000 9:41
#1a1a1a 4步开始你的按需定制生意
#666666 男士服装
#929292 搜索产品
#979797 SKU: DG120
#ff0000 ¥19.00
#ff6800 11国
#ffffff 美国
rgba(0, 0, 0, 0.90) 产品详情

字号规范

px rpx (约) 用途
28.0px 54rpx
20.0px 38rpx
18.0px 35rpx
16.0px 31rpx
15.0px 29rpx
14.0px 27rpx
13.0px 25rpx
12.0px 23rpx
11.0px 21rpx
10.0px 19rpx

布局适配说明

  • 设计稿基于 390px 宽度
  • uniapp 使用 rpx 单位:1px ≈ 1.923rpx
  • 开发时将 px 值 × 1.923 四舍五入转为 rpx
  • 顶部导航栏使用 uniapp 原生 navigationBarTitleText,无需自定义
  • 底部安全区使用 padding-bottom: env(safe-area-inset-bottom)

交互状态规范

Figma 中使用静态设计表达选中/默认状态,以下为各页面可交互元素的状态对比。 所有状态的主色均为 #ff6800(橙色),默认态为灰色边框/白色背景。

产品详情页

颜色选择按钮

状态 边框色 边框宽度 圆角 尺寸 文字色
默认态 #f2f2f2 1px 60px(胶囊) 73×29px #1a1a1a
选中态 #ff6800 1px 60px(胶囊) 73×29px #1a1a1a
  • 交互方式:点击切换,单选
  • 内部有颜色圆点(实际颜色由数据决定)
  • uniapp 实现:view 标签 + border,通过 :class 切换选中样式
<view class="color-item" :class="{ active: activeColorId === item.id }" @click="selectColor(item)">
  <view class="color-dot" :style="{ background: item.color }"></view>
  <text class="color-name">{{ item.name }}</text>
</view>
.color-item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 58rpx;
  padding: 0 24rpx;
  border: 2rpx solid #f2f2f2;
  border-radius: 120rpx;
}
.color-item.active {
  border-color: #ff6800;
}

尺码选择按钮

状态 背景色 边框色 圆角 尺寸 文字色 字重
默认态 #ffffff #f2f2f2 6px 约 40×34px #1a1a1a 400
选中态 #ff6800 #ff6800 6px 约 40×34px #ffffff 700
  • 交互方式:点击切换,单选
  • 容器横向排列,间距 6px
  • uniapp 实现:view 横向排列,flex 布局
.size-list {
  display: flex;
  flex-wrap: wrap;
  gap: 12rpx;
}
.size-item {
  min-width: 80rpx;
  height: 68rpx;
  padding: 0 16rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2rpx solid #f2f2f2;
  border-radius: 12rpx;
  font-size: 24rpx;
  color: #1a1a1a;
  background: #fff;
}
.size-item.active {
  background: #ff6800;
  border-color: #ff6800;
  color: #fff;
  font-weight: 700;
}

货盘页

国家选择按钮

状态 背景色 文字色 圆角 说明
默认态 #f5f5f5 #1a1a1a 较大圆角 灰底黑字
选中态 #ff6800 #ffffff 较大圆角 橙底白字
  • 交互方式:点击切换,单选;再次点击已选中的国家则取消选中
  • 横向滚动(国家数量多时可左右滑动)
  • 每个国家按钮含国旗图标 + 国家名称

左侧分类选中态

状态 背景色 文字色 文字大小 左侧指示条
默认态 #f8f8f8 #666666 14px
选中态 #ffffff #1a1a1a 14px 左侧 3px 橙色竖条
  • 交互方式:点击切换,单选
  • 左侧竖条高度与文字行高一致或稍高
  • uniapp 实现:左侧用 view 做指示条,通过 :class 控制显示
.category-item {
  position: relative;
  padding: 24rpx 16rpx;
  background: #f8f8f8;
  font-size: 28rpx;
  color: #666;
  text-align: center;
}
.category-item.active {
  background: #fff;
  color: #1a1a1a;
  font-weight: 500;
}
.category-item.active::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6rpx;
  height: 32rpx;
  background: #ff6800;
  border-radius: 0 4rpx 4rpx 0;
}

筛选标签按钮

状态 背景色 文字色 边框色 圆角
默认态 #ffffff #666666 #f2f2f2 4px
选中态 #ff6800 #ffffff #ff6800 4px
  • 交互方式:点击切换,多选(可同时选中多个标签)
  • 标签按类型分组(物流渠道/印刷位置/印刷工艺)
  • 确认按钮应用筛选,重置按钮清空选择

首页

首页主要为展示型内容,交互状态较少:

  • 4步流程卡片:静态展示,无选中态
  • 平台功能卡片:静态展示,无选中态
  • 优势卡片(零库存/快速生产/优质产品/全球配送):静态展示,带图标 + 文字

横向滚动区域

设计稿中宽度超过 390px 的区域,实际开发时使用横向滚动(scroll-viewswiper)。 最终显示数量由后端数据决定,但布局样式按设计稿实现。

首页

全球POD货盘 横向滚动

  • 位置:首页中部,"全球POD货盘"标题下方
  • 内容:多个产品卡片横向排列
  • 实现方式scroll-view scroll-x
  • 卡片间距:按设计稿间距设置
  • 左右内边距:与页面左右边距一致
<scroll-view scroll-x class="pod-scroll" show-scrollbar="false">
  <view class="pod-list">
    <view class="pod-card" v-for="item in goodsList" :key="item.id">
      <!-- 产品卡片内容 -->
    </view>
  </view>
</scroll-view>
.pod-scroll {
  width: 100%;
  white-space: nowrap;
}
.pod-list {
  display: inline-flex;
  gap: 24rpx;
  padding: 0 32rpx;
}

平台功能卡片 横向滚动

  • 位置:首页中下部,"用强大的功能,开启盈利快车道" 标题下方
  • 内容:多个功能卡片横向排列
  • 实现方式scroll-view scroll-x

货盘页

国家选择条 横向滚动

  • 位置:货盘页顶部,搜索栏下方
  • 内容:国家按钮横向排列(12+ 个国家)
  • 实现方式scroll-view scroll-x
  • 注意:总宽度超出 390px,必须横向滚动
  • 左右内边距:与页面内容对齐

商品列表

  • 布局:双列网格(2 列),纵向滚动
  • 宽度:在 390px 以内,正常流布局,不横向滚动

产品详情页

产品图片轮播

  • 位置:详情页顶部
  • 实现方式swiper 组件
  • 自动轮播:可选,建议开启

尺码表 横向滚动

  • 位置:产品尺码区域
  • 内容:尺码 × 肩宽/胸围/衣长/袖长 等维度表格
  • 实现方式scroll-view scroll-x 包裹 view 表格
  • 注意:尺码列数较多时可能超出屏幕宽度

包装规格表 横向滚动

  • 位置:包装规格区域
  • 内容:尺寸/体积/重量 等多列表格
  • 实现方式scroll-view scroll-x

首页

  • 页面尺寸390.0px × 3314.0px
  • 有效开发区域:y = 119px 以下(排除状态栏+导航栏)
  • 区块数量39 个主要区块
  • 文本节点69 个
  • 图片资源11 张
  • 图标资源4 个

区块结构

# 区块名称 类型 Y坐标 尺寸 (W×H) 关键样式
1 全球POD供应链平台 TEXT 149.0 257.0×39.0 fs:28.0
2 连接设计、生产、订单与全球物流,助力跨境卖家快速上新、稳定履约 TEXT 194.0 310.0×14.0 fs:10.0
3 Group 43 GROUP 226.0 276.0×38.0
4 Rectangle 178 RECTANGLE 259.0 390.0×390.0
5 Section Title TEXT 669.0 232.0×29.0 fs:20.0
6 Frame 53 FRAME 718.0 672.0×80.0
7 image 25 RECTANGLE 808.0 370.0×370.0 r:6.0
8 全球POD货盘 GROUP 1198.0 577.0×630.0
9 Section Title TEXT 1848.0 280.0×29.0 fs:20.0
10 Frame 54 FRAME 1897.0 672.0×80.0
11 Rectangle 64 RECTANGLE 1987.0 370.0×257.0 r:8.0
12 Rectangle 179 RECTANGLE 2264.0 390.0×261.0 bg:#f8f8f8
13 Section Title TEXT 2286.0 201.0×29.0 fs:20.0
14 Rectangle 182 RECTANGLE 2335.0 180.0×80.0 bg:#ffffff r:6.0
15 Rectangle 183 RECTANGLE 2335.0 180.0×80.0 bg:#ffffff r:6.0
16 快速生产图标 FRAME 2362.0 26.0×26.0 bg:#ffffff
17 零库存图标 FRAME 2362.0 26.0×26.0 bg:#ffffff
18 零库存 TEXT 2364.0 48.0×22.0 fs:16.0
19 快速生产 TEXT 2364.0 64.0×22.0 fs:16.0
20 Rectangle 184 RECTANGLE 2425.0 180.0×80.0 bg:#ffffff r:6.0
21 Rectangle 185 RECTANGLE 2425.0 180.0×80.0 bg:#ffffff r:6.0
22 优质产品图标 FRAME 2452.0 26.0×26.0 bg:#ffffff
23 全球配送图标 FRAME 2452.0 26.0×26.0 bg:#ffffff
24 优质产品 TEXT 2454.0 64.0×22.0 fs:16.0
25 全球配送 TEXT 2454.0 64.0×22.0 fs:16.0
26 公司简介背景 RECTANGLE 2525.0 391.0×544.0
27 公司简介 TEXT 2545.0 80.0×28.0 fs:20.0
28 用科技重新定义POD供应链 让每一个创意,都能高效抵达全球 TEXT 2593.0 257.0×50.0 fs:18.0
29 INKREACH印美达全球,一家以AI与智能印花技术驱动的全球化POD柔性供应链公司,致力于成为全球创业者最可靠的成长伙伴。 TEXT 2653.0 370.0×34.0 fs:12.0
30 服务对象与场景 TEXT 2707.0 98.0×20.0 fs:14.0
31 愿景 TEXT 2707.0 28.0×20.0 fs:14.0
32 服务于数千家跨境独立站、TikTok、TEMU、SHEIN等平台商家,提供从海外生产到末端物流的一站式供应链服务,让电商创业者专注增长,无惧后端履约。 TEXT 2737.0 173.0×102.0 fs:12.0
33 我们坚信,每一个创意都值得被完美呈现。
Inkreach将持续深耕智能供应链生态,用科技消除制造壁垒,让全球创业者专注发挥创造力,共同书写个性化电商的新纪元。 TEXT 2737.0 173.0×102.0 fs:12.0
34 Group 44 GROUP 2859.0 180.0×90.0
35 Group 45 GROUP 2859.0 180.0×90.0
36 Group 46 GROUP 2959.0 180.0×90.0
37 Group 47 GROUP 2959.0 180.0×90.0
38 Group 48 GROUP 3069.0 391.0×219.0
39 Group 57 GROUP 3289.0 390.0×56.0

文本样式详情

28.0px / 400 / transparent

font-size: 28.0px;  /* 54rpx */
font-weight: 400;
color: transparent;
line-height: 39.2px;

示例:全球POD供应链平台

20.0px / 400 / #1a1a1a

font-size: 20.0px;  /* 38rpx */
font-weight: 400;
color: #1a1a1a;
line-height: 29.0px;

示例:4步开始你的按需定制生意、全球POD货盘、用强大的功能,开启盈利快车道

20.0px / 400 / #000000

font-size: 20.0px;  /* 38rpx */
font-weight: 400;
color: #000000;
line-height: 28.0px;

示例:公司简介

18.0px / 400 / transparent

font-size: 18.0px;  /* 35rpx */
font-weight: 400;
color: transparent;
line-height: 25.2px;

示例:用科技重新定义POD供应链 让每一个创意,都能高效抵达全球

16.0px / 400 / #ff6800

font-size: 16.0px;  /* 31rpx */
font-weight: 400;
color: #ff6800;
line-height: 22.4px;

示例:11国、24H、1000W+

16.0px / 400 / #000000

font-size: 16.0px;  /* 31rpx */
font-weight: 400;
color: #000000;
line-height: 22.4px;

示例:女士短款露脐T恤、零库存、优质产品

16.0px / 900 / #ffffff

font-size: 16.0px;  /* 31rpx */
font-weight: 900;
color: #ffffff;
line-height: 26.0px;

示例:01、04

16.0px / 400 / #ffffff

font-size: 16.0px;  /* 31rpx */
font-weight: 400;
color: #ffffff;
line-height: 22.4px;

示例:选择产品、设计工具、店铺集成

16.0px / 900 / #ff6800

font-size: 16.0px;  /* 31rpx */
font-weight: 900;
color: #ff6800;
line-height: 26.0px;

示例:02、03、04

15.0px / 600 / #000000

font-size: 15.0px;  /* 29rpx */
font-weight: 600;
color: #000000;
line-height: 20.0px;

示例:9:41

14.0px / 400 / #000000

font-size: 14.0px;  /* 27rpx */
font-weight: 400;
color: #000000;
line-height: 19.6px;

示例:服务对象与场景、愿景

13.0px / 400 / #ffffff

font-size: 13.0px;  /* 25rpx */
font-weight: 400;
color: #ffffff;
line-height: 18.2px;

示例:美国

13.0px / 400 / #000000

font-size: 13.0px;  /* 25rpx */
font-weight: 400;
color: #000000;
line-height: 18.2px;

示例:加拿大、墨西哥、巴西

12.0px / 400 / #ff6800

font-size: 12.0px;  /* 23rpx */
font-weight: 400;
color: #ff6800;
line-height: 16.8px;

示例:更多产品

12.0px / 400 / #000000

font-size: 12.0px;  /* 23rpx */
font-weight: 400;
color: #000000;
line-height: 16.8px;

示例:INKREACH印美达全球,一家以AI与智能印花技术驱动的全、服务于数千家跨境独立站、TikTok、TEMU、SHEIN等、我们坚信,每一个创意都值得被完美呈现。
Inkreach将持

10.0px / 400 / #000000

font-size: 10.0px;  /* 19rpx */
font-weight: 400;
color: #000000;
line-height: 14.0px;

示例:连接设计、生产、订单与全球物流,助力跨境卖家快速上新、稳定履、搭载最新智能印花工艺,品质与效率兼得、11国自营本土化POD工厂,日均产能超20万单

10.0px / 400 / #ffffff

font-size: 10.0px;  /* 19rpx */
font-weight: 400;
color: #ffffff;
line-height: 14.0px;

示例:海量精选产品,满足多元定制需求、轻松设计,快速定制、与全球主流电商平台无缝对接

货盘

  • 页面尺寸390.0px × 844.0px
  • 有效开发区域:y = 119px 以下(排除状态栏+导航栏)
  • 区块数量13 个主要区块
  • 文本节点42 个
  • 图片资源21 张
  • 图标资源0 个

区块结构

# 区块名称 类型 Y坐标 尺寸 (W×H) 关键样式
1 Country Filter Bar FRAME 119.0 390.0×99.0 bg:#ffffff
2 Category Sidebar FRAME 218.0 90.0×794.0 bg:#ffffff
3 Frame 55 FRAME 228.0 95.0×26.0 bg:#ffffff r:60.0
4 Frame 56 FRAME 228.0 94.0×26.0 bg:#ffffff r:60.0
5 Group 49 GROUP 264.0 135.0×180.0 r:6.0
6 Group 50 GROUP 264.0 135.0×180.0 r:6.0
7 Group 51 GROUP 454.0 135.0×180.0 r:6.0
8 Group 52 GROUP 454.0 135.0×180.0 r:6.0
9 Group 53 GROUP 644.0 135.0×180.0 r:6.0
10 Group 54 GROUP 644.0 135.0×180.0 r:6.0
11 Group 57 GROUP 819.0 390.0×56.0
12 Group 55 GROUP 834.0 135.0×180.0 r:6.0
13 Group 56 GROUP 834.0 135.0×180.0 r:6.0

文本样式详情

15.0px / 600 / #000000

font-size: 15.0px;  /* 29rpx */
font-weight: 600;
color: #000000;
line-height: 20.0px;

示例:9:41

15.0px / 400 / #ff0000

font-size: 15.0px;  /* 29rpx */
font-weight: 400;
color: #ff0000;
line-height: 21.0px;

示例:¥19.00

13.0px / 400 / #929292

font-size: 13.0px;  /* 25rpx */
font-weight: 400;
color: #929292;
line-height: 19.0px;

示例:搜索产品

13.0px / 400 / #ffffff

font-size: 13.0px;  /* 25rpx */
font-weight: 400;
color: #ffffff;
line-height: 19.0px;

示例:搜索

13.0px / 500 / #ff6800

font-size: 13.0px;  /* 25rpx */
font-weight: 500;
color: #ff6800;
line-height: 17.0px;

示例:全部商品

13.0px / 400 / #666666

font-size: 13.0px;  /* 25rpx */
font-weight: 400;
color: #666666;
line-height: 17.0px;

示例:男士服装、女士服装、儿童服装

13.0px / 400 / #000000

font-size: 13.0px;  /* 25rpx */
font-weight: 400;
color: #000000;
line-height: 18.2px;

示例:200g纯棉T恤

12.0px / 400 / #000000

font-size: 12.0px;  /* 23rpx */
font-weight: 400;
color: #000000;
line-height: 16.8px;

示例:美国、波兰、日本

12.0px / 400 / #ff6800

font-size: 12.0px;  /* 23rpx */
font-weight: 400;
color: #ff6800;
line-height: 16.8px;

示例:180G纯棉T恤

10.0px / 400 / #000000

font-size: 10.0px;  /* 19rpx */
font-weight: 400;
color: #000000;
line-height: 14.0px;

示例:首页、产品

产品详情

  • 页面尺寸390.0px × 1717.0px
  • 有效开发区域:y = 119px 以下(排除状态栏+导航栏)
  • 区块数量111 个主要区块
  • 文本节点98 个
  • 图片资源1 张
  • 图标资源1 个

区块结构

# 区块名称 类型 Y坐标 尺寸 (W×H) 关键样式
1 Rectangle 194 RECTANGLE 119.0 390.0×260.0 bg:#f2f2f2
2 Frame 105 FRAME 361.0 72.0×8.0
3 Product Name TEXT 389.0 370.0×26.0 fs:18.0
4 SKU TEXT 419.0 70.0×17.0 fs:12.0
5 SKU TEXT 419.0 56.0×17.0 fs:12.0
6 ¥19.00 TEXT 446.0 54.0×34.0 fs:15.0
7 Line 23 LINE 490.0 370.0×0.0
8 生产工艺 TEXT 501.0 40.0×14.0 fs:10.0
9 发货时效 TEXT 501.0 40.0×14.0 fs:10.0
10 印花 TEXT 501.0 20.0×14.0 fs:10.0
11 产品编码 TEXT 501.0 40.0×14.0 fs:10.0
12 白墨烫画 TEXT 521.0 52.0×17.0 fs:13.0
13 48小时 TEXT 521.0 42.0×17.0 fs:13.0
14 单面印 TEXT 521.0 39.0×17.0 fs:13.0
15 NS6001152 TEXT 521.0 73.0×17.0 fs:13.0
16 Rectangle 195 RECTANGLE 550.0 390.0×6.0 bg:#f5f5f5
17 颜色 TEXT 571.0 30.0×17.0 fs:15.0
18 Frame 107 FRAME 603.0 73.0×29.0 r:60.0
19 Frame 108 FRAME 603.0 73.0×29.0 r:60.0
20 Frame 109 FRAME 603.0 73.0×29.0 r:60.0
21 Frame 110 FRAME 603.0 73.0×29.0 r:60.0
22 Frame 111 FRAME 642.0 73.0×29.0 r:60.0
23 Frame 112 FRAME 642.0 73.0×29.0 r:60.0
24 Rectangle 196 RECTANGLE 686.0 390.0×6.0 bg:#f5f5f5
25 尺码 TEXT 707.0 30.0×17.0 fs:15.0
26 Frame 113 FRAME 739.0 244.0×34.0
27 Rectangle 197 RECTANGLE 788.0 390.0×6.0 bg:#f5f5f5
28 产品参数 TEXT 809.0 60.0×17.0 fs:15.0
29 克重 TEXT 851.0 26.0×17.0 fs:13.0
30 180g TEXT 851.0 32.0×17.0 fs:13.0
31 Line 24 LINE 880.0 370.0×0.0
32 材质 TEXT 892.0 26.0×17.0 fs:13.0
33 纯棉 TEXT 892.0 26.0×17.0 fs:13.0
34 Line 25 LINE 921.0 370.0×0.0
35 定制类型 TEXT 933.0 52.0×17.0 fs:13.0
36 来图定制 TEXT 933.0 52.0×17.0 fs:13.0
37 Line 26 LINE 962.0 370.0×0.0
38 补充说明 TEXT 974.0 52.0×17.0 fs:13.0
39 【 材质说明 】 97%聚酯纤维 3%氨纶 【 产品性能 】 优质材料:这款露背T恤采用优质材料制成,面料柔软、轻薄贴身。 时尚外观:性感T恤设计,时尚性感,简约大方,适合大多数人的体型。 面料轻盈:舒适款式设计为您带来一个更加干净的外观,面料轻盈柔软,让您全天舒适。 轻松百搭:简单搭配外套、长裤、牛仔裤或沙滩休闲短裤,都是非常不错的选择,也可以选择就单穿,让您一直保持凉爽和放松。 【 适用情景 】 适用于日常生活、工作、出游、逛街等场合。 【 洗涤说明 】 可手洗可机洗,不要长时间浸泡,不可漂白,洗涤液温度不能超过45ºC。 【 温馨提醒 】 该图片展示效果仅供参考,最终效果以实物为准!由于生产批次、机器设备、纸样大小不同等客观因素原因,难以避免或将存在微小色差、位置及大小等误差,如遇以上问题均属于正常现象,将不予纳入售后处理范畴。 另外,根据各国本土政策要求,请勿上传科技单、跑水单等非正规来源面单,严禁使用侵权图案及未授权 IP、商标、赛事元素等内容。 违规订单将不予生产发货,已产生费用不予退还,相应风险与责任由下单方自行承担。感谢您的理解与配合。 TEXT 974.0 279.0×118.0 fs:13.0
40 Rectangle 207 RECTANGLE 1062.0 390.0×60.0
41 展开 TEXT 1099.0 24.0×17.0 fs:12.0
42 展开 FRAME 1102.0 12.0×12.0 bg:#ffffff
43 Rectangle 198 RECTANGLE 1122.0 390.0×6.0 bg:#f5f5f5
44 产品尺码 TEXT 1143.0 60.0×17.0 fs:15.0
45 单位:cm TEXT 1145.0 49.0×17.0 fs:11.0
46 单位:cm TEXT 1145.0 49.0×17.0 fs:11.0
47 Rectangle 199 RECTANGLE 1175.0 370.0×40.0 bg:#dfdfdf r:6.0
48 尺码 TEXT 1186.0 26.0×17.0 fs:13.0
49 肩宽 TEXT 1186.0 26.0×17.0 fs:13.0
50 胸围 TEXT 1186.0 26.0×17.0 fs:13.0
51 衣长 TEXT 1186.0 26.0×17.0 fs:13.0
52 袖长 TEXT 1186.0 26.0×17.0 fs:13.0
53 S TEXT 1226.0 9.0×17.0 fs:13.0
54 51 TEXT 1226.0 16.0×17.0 fs:13.0
55 56 TEXT 1226.0 16.0×17.0 fs:13.0
56 62 TEXT 1226.0 16.0×17.0 fs:13.0
57 48 TEXT 1226.0 16.0×17.0 fs:13.0
58 Rectangle 201 RECTANGLE 1255.0 370.0×40.0 bg:#f7f7f7 r:6.0
59 51 TEXT 1267.0 16.0×17.0 fs:13.0
60 56 TEXT 1267.0 16.0×17.0 fs:13.0
61 62 TEXT 1267.0 16.0×17.0 fs:13.0
62 48 TEXT 1267.0 16.0×17.0 fs:13.0
63 M TEXT 1267.0 12.0×17.0 fs:13.0
64 51 TEXT 1306.0 16.0×17.0 fs:13.0
65 56 TEXT 1306.0 16.0×17.0 fs:13.0
66 62 TEXT 1306.0 16.0×17.0 fs:13.0
67 48 TEXT 1306.0 16.0×17.0 fs:13.0
68 L TEXT 1306.0 8.0×17.0 fs:13.0
69 Rectangle 202 RECTANGLE 1335.0 370.0×40.0 bg:#f7f7f7 r:6.0
70 51 TEXT 1347.0 16.0×17.0 fs:13.0
71 56 TEXT 1347.0 16.0×17.0 fs:13.0
72 62 TEXT 1347.0 16.0×17.0 fs:13.0
73 48 TEXT 1347.0 16.0×17.0 fs:13.0
74 XL TEXT 1347.0 16.0×17.0 fs:13.0
75 Rectangle 203 RECTANGLE 1390.0 390.0×6.0 bg:#f5f5f5
76 包装规格 TEXT 1411.0 60.0×17.0 fs:15.0
77 Rectangle 204 RECTANGLE 1443.0 370.0×40.0 bg:#dfdfdf r:6.0
78 尺码 TEXT 1454.0 26.0×17.0 fs:13.0
79 尺寸 TEXT 1454.0 26.0×17.0 fs:13.0
80 体积 TEXT 1454.0 26.0×17.0 fs:13.0
81 重量 TEXT 1454.0 26.0×17.0 fs:13.0
82 200.00g TEXT 1494.0 39.0×17.0 fs:10.0
83 31.023.01.0cm TEXT 1495.0 81.0×17.0 fs:10.0
84 713.00cm³ TEXT 1495.0 52.0×17.0 fs:10.0
85 S TEXT 1505.0 9.0×17.0 fs:13.0
86 12.209.060.39in TEXT 1514.0 87.0×17.0 fs:10.0
87 43.51in³ TEXT 1514.0 40.0×17.0 fs:10.0
88 0.36lb TEXT 1514.0 29.0×17.0 fs:10.0
89 Rectangle 205 RECTANGLE 1543.0 370.0×60.0 bg:#f7f7f7 r:6.0
90 200.00g TEXT 1554.0 39.0×17.0 fs:10.0
91 31.023.01.0cm TEXT 1555.0 81.0×17.0 fs:10.0
92 713.00cm³ TEXT 1555.0 52.0×17.0 fs:10.0
93 M TEXT 1565.0 12.0×17.0 fs:13.0
94 12.209.060.39in TEXT 1574.0 87.0×17.0 fs:10.0
95 43.51in³ TEXT 1574.0 40.0×17.0 fs:10.0
96 0.36lb TEXT 1574.0 29.0×17.0 fs:10.0
97 200.00g TEXT 1614.0 39.0×17.0 fs:10.0
98 31.023.01.0cm TEXT 1615.0 81.0×17.0 fs:10.0
99 713.00cm³ TEXT 1615.0 52.0×17.0 fs:10.0
100 L TEXT 1623.0 8.0×17.0 fs:13.0
101 12.209.060.39in TEXT 1634.0 87.0×17.0 fs:10.0
102 43.51in³ TEXT 1634.0 40.0×17.0 fs:10.0
103 0.36lb TEXT 1634.0 29.0×17.0 fs:10.0
104 Rectangle 206 RECTANGLE 1663.0 370.0×60.0 bg:#f7f7f7 r:6.0
105 200.00g TEXT 1674.0 39.0×17.0 fs:10.0
106 31.023.01.0cm TEXT 1675.0 81.0×17.0 fs:10.0
107 713.00cm³ TEXT 1675.0 52.0×17.0 fs:10.0
108 XL TEXT 1685.0 16.0×17.0 fs:13.0
109 12.209.060.39in TEXT 1694.0 87.0×17.0 fs:10.0
110 43.51in³ TEXT 1694.0 40.0×17.0 fs:10.0
111 0.36lb TEXT 1694.0 29.0×17.0 fs:10.0

文本样式详情

18.0px / 400 / #1a1a1a

font-size: 18.0px;  /* 35rpx */
font-weight: 400;
color: #1a1a1a;
line-height: 26.0px;

示例:180G牛奶丝T恤 DG120

16.0px / 500 / rgba(0, 0, 0, 0.90)

font-size: 16.0px;  /* 31rpx */
font-weight: 500;
color: rgba(0, 0, 0, 0.90);
line-height: 24.0px;

示例:产品详情

15.0px / 600 / #000000

font-size: 15.0px;  /* 29rpx */
font-weight: 600;
color: #000000;
line-height: 20.0px;

示例:9:41

15.0px / 400 / #ff0000

font-size: 15.0px;  /* 29rpx */
font-weight: 400;
color: #ff0000;
line-height: 21.0px;

示例:¥19.00

15.0px / 400 / #000000

font-size: 15.0px;  /* 29rpx */
font-weight: 400;
color: #000000;
line-height: 17.0px;

示例:颜色、尺码、产品参数

14.0px / 400 / #000000

font-size: 14.0px;  /* 27rpx */
font-weight: 400;
color: #000000;
line-height: 17.0px;

示例:白色、藏青、黑色

14.0px / 400 / #ff6800

font-size: 14.0px;  /* 27rpx */
font-weight: 400;
color: #ff6800;
line-height: 17.0px;

示例:灰色

13.0px / 400 / #000000

font-size: 13.0px;  /* 25rpx */
font-weight: 400;
color: #000000;
line-height: 17.0px;

示例:白墨烫画、48小时、单面印

13.0px / 400 / #ff6800

font-size: 13.0px;  /* 25rpx */
font-weight: 400;
color: #ff6800;
line-height: 17.0px;

示例:L

12.0px / 400 / #979797

font-size: 12.0px;  /* 23rpx */
font-weight: 400;
color: #979797;
line-height: 17.0px;

示例:SKU: DG120、国家: 美国

12.0px / 400 / #000000

font-size: 12.0px;  /* 23rpx */
font-weight: 400;
color: #000000;
line-height: 17.0px;

示例:展开

11.0px / 400 / #000000

font-size: 11.0px;  /* 21rpx */
font-weight: 400;
color: #000000;
line-height: 17.0px;

示例:单位:cm

10.0px / 400 / #979797

font-size: 10.0px;  /* 19rpx */
font-weight: 400;
color: #979797;
line-height: 14.0px;

示例:生产工艺、发货时效、印花

10.0px / 400 / #000000

font-size: 10.0px;  /* 19rpx */
font-weight: 400;
color: #000000;
line-height: 17.0px;

示例:31.023.01.0cm、713.00cm³、12.209.060.39in

资源文件

图片资源

文件名 来源页面 说明
assets/home/images/Rectangle_178_1426_1248.png 首页 首页
assets/home/images/Rectangle_181_1455_1450.png 首页 女士短款
assets/home/images/Rectangle_181_1455_1456.png 首页 女士短款
assets/home/images/Rectangle_63_1446_1437.png 首页 女士短款
assets/home/images/Rectangle_63_1455_1461.png 首页 女士短款
assets/home/images/公司简介背景_1461_1606.png 首页 首页
assets/home/images/image_25_1484_1689.png 首页 首页
assets/home/images/Rectangle_64_1484_1735.png 首页 首页
assets/home/images/image_26_1496_1761.png 首页 Group 48
assets/home/images/Rectangle_187_1470_1653.png 首页 Group 48
assets/home/images/image_28_1498_1767.png 首页 Group 48
assets/products/images/Rectangle_149_1519_255.png 货盘 Frame 94
assets/products/images/Rectangle_150_1533_389.png 货盘 Frame 94
assets/products/images/Rectangle_150_1533_381.png 货盘 Frame 94
assets/products/images/Rectangle_150_1533_383.png 货盘 Frame 94
assets/products/images/Rectangle_150_1533_391.png 货盘 Frame 94
assets/products/images/Rectangle_150_1533_387.png 货盘 Frame 94
assets/products/images/Rectangle_149_1523_264.png 货盘 Frame 94
assets/products/images/Rectangle_150_1533_393.png 货盘 Frame 94
assets/products/images/Rectangle_149_1523_324.png 货盘 Frame 94
assets/products/images/Rectangle_150_1533_385.png 货盘 Frame 94
assets/products/images/Rectangle_150_1533_395.png 货盘 Frame 94
assets/products/images/Rectangle_149_1523_272.png 货盘 Frame 94
assets/products/images/Rectangle_149_1523_312.png 货盘 Frame 94
assets/products/images/Rectangle_192_1523_347.png 货盘 Group 49
assets/products/images/Rectangle_192_1529_361.png 货盘 Group 51
assets/products/images/Rectangle_192_1529_371.png 货盘 Group 53
assets/products/images/Rectangle_192_1544_408.png 货盘 Group 55
assets/products/images/Rectangle_192_1529_356.png 货盘 Group 50
assets/products/images/Rectangle_192_1529_366.png 货盘 Group 52
assets/products/images/Rectangle_192_1529_376.png 货盘 Group 54
assets/products/images/Rectangle_192_1544_413.png 货盘 Group 56
assets/product-detail/images/Rectangle_194_1548_574.png 产品详情 产品详情

图标资源 (SVG)

文件名 来源页面 尺寸 说明
assets/home/icons/优质产品图标.svg 首页 26.0×26.0 首页
assets/home/icons/快速生产图标.svg 首页 26.0×26.0 首页
assets/home/icons/全球配送图标.svg 首页 26.0×26.0 首页
assets/home/icons/零库存图标.svg 首页 26.0×26.0 首页
assets/product-detail/icons/Outlined_back.svg 产品详情 24.0×24.0 .Navigation Bar_Left

本文档由 Figma API 自动生成,数据精确到像素级。