全套可复制的 HTML + CSS 促销标签

包含最常用的 20 个，每个都配了电商最吸睛的颜色，复制就能用！

<style>
/* 基础标签样式 */
.badge {
  display: inline-block;
  padding: 2px 6px;
  border-radIUs: 3px;
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  margin-right: 6px;
  line-height: 1.2;
}
</style>

<!-- 爆款热销类（红/橙） -->
<span class="badge" style="background:#ff3000;">热卖</span>
<span class="badge" style="background:#ff5c00;">爆款</span>
<span class="badge" style="background:#ff7700;">热销</span>
<span class="badge" style="background:#ff9500;">人气</span>

<!-- 优惠折扣类（紫/蓝） -->
<span class="badge" style="background:#ff2fa3;">特价</span>
<span class="badge" style="background:#d428ad;">特惠</span>
<span class="badge" style="background:#a72bcd;">限时</span>
<span class="badge" style="background:#772ae8;">清仓</span>
<span class="badge" style="background:#5a3bec;">捡漏</span>
<span class="badge" style="background:#3f5af0;">立减</span>

<!-- 新品现货类（绿/青） -->
<span class="badge" style="background:#00b882;">新品</span>
<span class="badge" style="background:#00c878;">新款</span>
<span class="badge" style="background:#00d872;">上新</span>
<span class="badge" style="background:#00a8c8;">现货</span>
<span class="badge" style="background:#0098d8;">秒发</span>
<span class="badge" style="background:#0088e8;">限量</span>

<!-- 品质保障类（灰/黑） -->
<span class="badge" style="background:#666;">正品</span>
<span class="badge" style="background:#777;">精选</span>
<span class="badge" style="background:#888;">严选</span>

<!-- 活动引流类（深红） -->
<span class="badge" style="background:#e6005c;">秒杀</span>

颜色说明（电商高转化配色）

• 红色 / 橙色：热卖、爆款、人气（最抓眼）
• 紫色 / 粉色：特价、限时、清仓（女生类目超好用）
• 绿色 / 青色：新品、现货、秒发（清爽可信）
• 灰色：正品、精选、严选（高级感）
• 深红色：秒杀（紧迫感）

总结

• 20 个最常用电商促销标签
• 每个都配了高点击颜色
• 纯 HTML+CSS，直接复制可用
• 适配闲鱼、淘宝、拼多多、小程序、网页