CODEWITHSUNDEEP
css
huishan037
huishan037

Reputation: 11

Banding too obvious in radient gradient

I need to create a webpage that looks exactly like the one below: http://imgur.com/40TiQiY.jpg

What i have currently done: http://imgur.com/uBaaten.png

body {
 background: red; /* For browsers that do not support gradients */
 background: -webkit-radial-gradient(#EF4747 0%, #7E2424 100%); /* Safari 5.1     to 6.0 */
 background: -o-radial-gradient(#EF4747 0%, #7E2424 100%); /* For Opera 11.6 to 12.0 */
 background: -moz-radial-gradient(#EF4747 0%, #7E2424 100%); /* For Firefox 3.6 to 15 */      background: radial-gradient(#EF4747 0%, #7E2424 100%); /* Standard syntax */
}

The banding of the radial gradient is too obvious in the second picture. How can i improve my current code to make it look like the first picture?

Any help appreciated! :)

Upvotes: 0

Views: 389

Answers (1)

Marc Hjorth
Marc Hjorth

Reputation: 1960

Used some RGB values instead of hex and I hope this is somewhat what you look for.

https://codepen.io/anon/pen/bpNLLJ

body {

    background: -webkit-radial-gradient(circle, rgb(255, 156, 156), rgb(255, 0, 0));
    height: 1000px; 
    width: 1000px

}

Upvotes: 1

Related Questions