css3 - how to make smooth linear gradient stripe with border-radius -


i trying create stripes using linear-gradient can't angle combination produce smooth effect thats not blotchy.

current code

 .circle {   background: linear-gradient(-45deg, rgba(255,255,255, 1) 25%, transparent 25%, transparent 50%, rgba(255,255,255, 1) 50%, rgba(255,255,255, 1) 75%, transparent 2%, transparent);     background-size:40px 40px ;     width:300px;     height:300px;     border-radius:150px; -moz-background-clip: padding;   background-clip: padding-box;  -webkit-background-clip: padding-box; }   

http://jsbin.com/fohayaxa/1/edit

the effect looks clean me, see smooth angled lines. there similar patterns on this site achieve you're looking (or have done).


Comments