Wechat applet color gradient

effect ：

style：

button[type=primary] {

     background: linear-gradient(to right, #03A9F4, #7C4DFF);
     
}

Copy

Pay attention to the use of background, But can't use background-color.

grammar ：

Same as css equally :

linear-gradient( color1 , color2 );

Copy

Default from top to bottom , Two parameters , The first parameter is omitted , The first parameter controls the direction .

about ：

background: linear-gradient(to right, #03A9F4, #7C4DFF);

Copy

Diagonally ：

background: linear-gradient(to bottom right, #03A9F4, #7C4DFF);

Copy

More to see ：https://www.runoob.com/css3/css3-gradients.html