div{
    background:linear-gradient(to right, red, yellow)
    height:180px;
    width:460px;
}

div{
    background:linear-gradient(to top, red, yellow)
    height:180px;
    width:460px;
}

div{
    background:linear-gradient(to top right, red, yellow)
    height:180px;
    width:460px;
}

div{
    background:linear-gradient(to bottom right, red, yellow)
    height:180px;
    width:460px;
}

div{
    background:linear-gradient(to right, red, blue, yellow)
    height:180px;
    width:460px;
}

div{
    background:linear-gradient(to right bottom, red, blue, yellow)
    height:180px;
    width:460px;
}

div{
    background:linear-gradient(12deg, red, green, yellow)
    height:180px;
    width:460px;
}

div{
    background:linear-gradient(0deg, red, yellow)
    height:180px;
    width:460px;
}

div{
    background:repeating-linear-gradient(90deg, red,yellow)
    height:180px;
    width:460px;
}

div{
    background:repeating-linear-gradient(45deg, red,yellow)
    height:180px;
    width:460px;
}

div{
    background:radial-gradient(red,yellow)
    height:180px;
    width:460px;
}

div{
    background:radial-gradient(circle, red, yellow)
    height:180px;
    width:460px;
}

div{
    background:radial-gradient(closest-side at 80% 80%, red, yellow)
    height:180px;
    width:460px;
}

div{
    background:radial-gradient(farthest-side at 80% 80%, red, yellow)
    height:180px;
    width:460px;
}

div{
    background:radial-gradient(closest-corner at 80% 80%, red, yellow)
    height:180px;
    width:460px;
}

div{
    background:radial-gradient(farthest-corner at 80% 80%, red, yellow)
    height:180px;
    width:460px;
}

div{
    background:repeating-radial-gradient(farthest-corner at 80% 80%, red, yellow 20%)
    height:180px;
    width:460px;
}

div{
    background:repeating-radial-gradient(farthest-corner at 50% 50%, red, yellow 1%)
    height:180px;
    width:460px;
}