锥形渐变描边持续旋转，像设备呼吸灯一样环绕卡片
← 返回 卡片 类特效列表conic-gradient + 旋转伪元素
上方为纯 CSS 实时演示，直接将鼠标移上去 / 点击感受效果
.fx{padding:30px 0}
.fx .cc{position:relative;width:250px;margin:0 auto;padding:20px;border-radius:16px;background:#0d1117;color:#e6edf3;z-index:0}
.fx .cc::before{content:"";position:absolute;inset:-2px;border-radius:18px;background:conic-gradient(#f778ba,#4a9eff,#57ab5a,#f778ba);z-index:-1;animation:kfx-cc 4s linear infinite}
.fx .cc::after{content:"";position:absolute;inset:0;border-radius:16px;background:#161b22;z-index:-1}
.fx .cc h4{margin:0 0 6px}
.fx .cc p{margin:0;font-size:13px;color:#9aa7b8}
@keyframes kfx-cc{to{transform:rotate(360deg)}}<div class="fx">
<div class="cc"><h4>流光边框卡片</h4><p>conic-gradient + 旋转伪元素</p></div>
</div>