CSS 渐变背景如何实现左上到右下的自然过渡？

Question

有大佬知道这种背景渐变色是怎么做到的嘛？

我尝试过把头部从左向右渐变，但是我做不到图片中左上到左下以及右上到右下那么丝滑的过度

Answer 1

左到右的渐变，用白色覆盖渐隐部分，叠加模式过滤掉白色，穿透鼠标事件

background: 
  linear-gradient(transparent, white 20%), 
  linear-gradient(to right, #c2def6, #ecc9e3);
mix-blend-mode: darken;
pointer-events: none;

Answer 2

1. 直接右键查看元素，看他们是怎么做的
2. 渐变可以指向任何角度，不止上下或左右，建议好好看看 MDN linear-gradient()

Answer 3

  background: linear-gradient(to right, #FFD59D, #F3B265);

具体颜色 可以自己填 角度也可以改

Answer 4

可以使用这个链接里的工具生成CSS https://cssgradient.io/

Answer 5

background: linear-gradient(transparent, white 20%), linear-gradient(to right, #def0ff, #fdf0f9);