fix(examples): add hsl interpolation to color wheel and move from syntax to examples

Author: TGianella

files/en-us/web/css/reference/values/gradient/conic-gradient/index.md

@@ -71,19 +71,6 @@ conic-gradient(from 90deg at 0 0, blue, red)
 /* Interpolation in polar color space
   with longer hue interpolation method */
 conic-gradient(in hsl longer hue, red, blue, green, red)
-
-/* Color wheel */
-conic-gradient(
-  hsl(360 100% 50%),
-  hsl(315 100% 50%),
-  hsl(270 100% 50%),
-  hsl(225 100% 50%),
-  hsl(180 100% 50%),
-  hsl(135 100% 50%),
-  hsl(90 100% 50%),
-  hsl(45 100% 50%),
-  hsl(0 100% 50%)
-)
 ```
 
 ### Values
@@ -311,6 +298,34 @@ The box on the left uses [shorter interpolation](/en-US/docs/Web/CSS/Reference/V
 
 {{EmbedLiveSample("Interpolating with hue", 240, 200)}}
 
+### Color Wheel
+
+```html hidden
+<div></div>
+```
+
+```css hidden
+div {
+  width: 100px;
+  height: 100px;
+  border-radius: 50px;
+}
+```
+
+```css
+div {
+  background-image: conic-gradient(
+    in hsl,
+    hsl(360 100% 50%),
+    hsl(240 100% 50%),
+    hsl(120 100% 50%),
+    hsl(0 100% 50%)
+  );
+}
+```
+
+{{EmbedLiveSample("Color Wheel", 100, 100)}}
+
 ### More conic-gradient examples
 
 Please see [Using CSS gradients](/en-US/docs/Web/CSS/Guides/Images/Using_gradients) for more examples.