gradient

#box1{
 width:300px;
 height:300px;
 margin:50px auto 0;
 background-color:#F36;
 background:--webkit--linear-gradient(bottom,#F36,#FFF);/*古いブラウザ対策*/
 background:linear-gradient(to top,#F36,#FFF);/*W3C方式*/
 border-radius:50%;
}

#box2{
 width:200px;
 height:100px;
 margin:50px auto 0;
 background-color:#F36;
 background:--webkit--linear-gradient
 (top,#ffced7 0%, #f74657 49%,#f10013 51%,#fe2951 100%);
 background:linear-gradient
 (to bottom,#ffced7 0%, #f74657 49%,#f10013 51%,#fe2951 100%);
}