body {
    background-image: radial-gradient(yellow, red); /* Sera responsiva y se adaptara al tamaño*/

    /* STOP */
    background-image: radial-gradient(yellow 50%, red 60%);
    background-image: radial-gradient(yellow 50%, red 50%);

    /* CENTRO */
    /* background-image:  [at x y], color1 [stop], color3 [stop], color3 [stop];
    at x y = cordenadas X y Y

    */
    background-image: radial-gradient(at 0 100%, yellow 50%, red 50%);

    /* TAMÑO */
    /* background-image:  [size shape] [at x y], color1 [stop], color3 [stop], color3 [stop]; 
    size = tamaño
    shape = forma (puede ser circle o ellipse)
    */
    background-image: radial-gradient(circle at 50% 50%, yellow 50%, red 50%);
    background-image: radial-gradient(ellipse at 50% 50%, yellow 50%, red 50%);

    /* si se omite la forma y no especificas circulo o elipse, toma la forma del objeto*/
    background-image: radial-gradient(at 50% 50%, yellow 50%, red 50%);

    /* si agrego forma pero no tamaño, el tamaño se va a adaptar al tamaño del elemento */
    background-image: radial-gradient(circle at 50% 50%, yellow 50%, red 50%);
    background-image: radial-gradient(ellipse at 50% 50%, yellow 50%, red 50%);

    /* Tamaño circulo */
    /* En este caso el circulo no se adapta porque ya se le dio un tamaño de 400px*/
    background-image: radial-gradient(400px circle at 50% 50%, yellow 50%, red 50%);
    background-image: radial-gradient(400px at 50% 50%, yellow 50%, red 50%); 
    /* Nota: el circulo solo necesita un valo, pero la elipse obligatoriamente necesita 2 valores*/

}

    body {
    background-image: radial-gradient(yellow, red); /* Sera responsiva y se adaptara al tamaño*/

    /* STOP */
    background-image: radial-gradient(yellow 50%, red 60%);
    background-image: radial-gradient(yellow 50%, red 50%);

    /* CENTRO */
    /* background-image:  [at x y], color1 [stop], color3 [stop], color3 [stop];
    at x y = cordenadas X y Y

    */
    background-image: radial-gradient(at 0 100%, yellow 50%, red 50%);

    /* TAMÑO */
    /* background-image:  [size shape] [at x y], color1 [stop], color3 [stop], color3 [stop]; 
    size = tamaño
    shape = forma (puede ser circle o ellipse)
    */
    background-image: radial-gradient(circle at 50% 50%, yellow 50%, red 50%);
    background-image: radial-gradient(ellipse at 50% 50%, yellow 50%, red 50%);

    /* si se omite la forma y no especificas circulo o elipse, toma la forma del objeto*/
    background-image: radial-gradient(at 50% 50%, yellow 50%, red 50%);

    /* si agrego forma pero no tamaño, el tamaño se va a adaptar al tamaño del elemento */
    background-image: radial-gradient(circle at 50% 50%, yellow 50%, red 50%);
    background-image: radial-gradient(ellipse at 50% 50%, yellow 50%, red 50%);

    /* Tamaño circulo */
    /* En este caso el circulo no se adapta porque ya se le dio un tamaño de 400px*/
    background-image: radial-gradient(400px circle at 50% 50%, yellow 50%, red 50%);
    background-image: radial-gradient(400px at 50% 50%, yellow 50%, red 50%); 
    /* Nota: el circulo solo necesita un valo, pero la elipse obligatoriamente necesita 2 valores*/

}

    body {
    background-image: radial-gradient(yellow, red); /* Sera responsiva y se adaptara al tamaño*/

    /* STOP */
    background-image: radial-gradient(yellow 50%, red 60%);
    background-image: radial-gradient(yellow 50%, red 50%);

    /* CENTRO */
    /* background-image:  [at x y], color1 [stop], color3 [stop], color3 [stop];
    at x y = cordenadas X y Y

    */
    background-image: radial-gradient(at 0 100%, yellow 50%, red 50%);

    /* TAMÑO */
    /* background-image:  [size shape] [at x y], color1 [stop], color3 [stop], color3 [stop]; 
    size = tamaño
    shape = forma (puede ser circle o ellipse)
    */
    background-image: radial-gradient(circle at 50% 50%, yellow 50%, red 50%);
    background-image: radial-gradient(ellipse at 50% 50%, yellow 50%, red 50%);

    /* si se omite la forma y no especificas circulo o elipse, toma la forma del objeto*/
    background-image: radial-gradient(at 50% 50%, yellow 50%, red 50%);

    /* si agrego forma pero no tamaño, el tamaño se va a adaptar al tamaño del elemento */
    background-image: radial-gradient(circle at 50% 50%, yellow 50%, red 50%);
    background-image: radial-gradient(ellipse at 50% 50%, yellow 50%, red 50%);

    /* Tamaño circulo */
    /* En este caso el circulo no se adapta porque ya se le dio un tamaño de 400px*/
    background-image: radial-gradient(400px circle at 50% 50%, yellow 50%, red 50%);
    background-image: radial-gradient(400px at 50% 50%, yellow 50%, red 50%); 
    /* Nota: el circulo solo necesita un valo, pero la elipse obligatoriamente necesita 2 valores*/

}