css实现渐变色

这是要实现的效果图,经常能看到这样一种效果，最初以为是用ps实现的后来发现了css3的一个关于背景图的属性background-clip,下面上实现的代码

.demo-1 {
  margin: 40px auto;
  width: 200px;
  height: 40px;
  border-radius: 20px;
  line-height: 40px;
  text-align: center;
  color: white;
  
  background-image: linear-gradient(
                    90deg,
                    #7e40ee 0,
                    #63d9ee 100%
    );
}
<div class="demo-1">
  按钮
</div>

点击这里看渐变色demo
参考链接#每日一记#让我们玩起流行的渐变色