YiKe

CSS 渐变动画生成器

可视化创建带动画效果的 CSS 渐变背景

渐变设置

%
%
%

CSS 代码

@keyframes gradient-anim-_R_2npfiv5udb_ {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

.gradient-box {
  background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #ec4899 100%);
  background-size: 400% 400%;
  animation: gradient-anim-_R_2npfiv5udb_ 5s ease infinite;
}

预设渐变

评论区(0)

登录后即可发表评论

暂无评论，来发表第一条评论吧