如何在OpenSea平台为NFT添加Trait rarity稀有度百分比？

实现这个浮在NFT作品对应特征旁的稀有度百分比标签，没什么复杂的，按下面的步骤做就行：

• 先算准稀有度基础数据
  先统计整个NFT合集里每个特征属性的出现频次：比如你的合集总供应量是10000份，其中带「金色瞳孔」特征的NFT一共120份，那这个特征的稀有度占比就是120 / 10000 = 1.2%。统计的时候记得按属性分类单独算，比如配饰类、背景类、五官类的特征不要混在一起统计，不然算出来的数值不准。
• 网页端展示的视觉效果用CSS就能快速搞定
  核心就是用相对+绝对定位做叠层：
  1. 给包裹NFT图片的外层容器加position: relative，作为标签定位的锚点
  2. 每个稀有度标签设position: absolute，手动调整top/left/right/bottom的偏移值，把标签挪到对应特征旁边，和示例里的位置对齐就行
  3. 标签样式照着示例做半透明深色底、小圆角、小字号白字就对了，基础样式可以参考这段代码：

/* NFT卡片外层容器 */
.nft-card {
  position: relative;
  width: 300px;
}
/* 稀有度标签通用样式 */
.rarity-badge {
  position: absolute;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  font-size: 12px;
}
/* 单独调整每个标签的位置，比如瞳孔特征对应的标签 */
.badge-eye {
  top: 42%;
  right: 10%;
}

要是想做鼠标悬停才显示标签的交互，默认给标签加opacity: 0，外层容器hover的时候把标签透明度改成1，加个0.2s的过渡动画，体验就很顺滑。

• 如果要把稀有度标签直接做进NFT成品图里，不用自己写前端，常用的NFT批量生成工具都自带稀有度标签合成功能，你把提前算好的特征稀有度映射表导进去，配置好标签的位置、字号、颜色样式，导出NFT图的时候就会自动把百分比标签印在对应位置。

两种实现方式按需选就行：前端动态渲染的标签后续调整稀有度数值、标签位置不用重新出图，灵活性更高；直接合成到原图的标签适配所有展示场景，不用依赖前端代码逻辑。

内容的提问来源于stack exchange，提问作者saedullah Misski