CSS3 Linear Gradient in a circular way

This is called Conical Gradient and is not currently possible in pure CSS, but it has been proposed for the CSS Image Values 4 draft. Recently Lea Verou created a polyfill for them, there is also a PostCSS plugin that does the same.


-- Updated with information from early 2022 --

It's doable now - at least with most browsers. The CSS property conic-gradient can easily achieve this:

html, body { margin: 0; padding: 0; }
.box {
    position: absolute;
    width: 200px;
    height: 200px;
    left: 100px;
}
.colorwheel {
    background: conic-gradient(red, yellow, lime, aqua, blue, magenta, red);
    border-radius:50%;
}
.fallback {
    text-align: center;
    padding: 50px 0;
}
<div class="fallback box">
    If you can read<br>this, your browser<br>doesn't support<br>conic-gradient yet.
</div>
<div class="colorwheel box"></div>

This CSS function is specified in an editor's draft of CSS Images Module Level 4 and is currently implement by most browsers including many mobile browsers. Check Can I use for current support.