-<p>The format of an HSL color value in the functional notation is hsl(<em>h</em>,<em>s</em>,<em>l</em>). The hue value <em>h</em> ranges from 0 to 360. Saturation and lightness (<em>s</em> and <em>l</em>) range from 0 to 255</p>
+<pre class="text">
+ hsl(0%, 100%, 50%) or hsl(0, 255, 127.5) full red
+ hsb(33.3333%, 100%, 100%) or hsl(120, 255, 255) white
+ hsl(33.3333%, 100%, 75%) or hsl(120, 255, 191.25) pastel green
+ hsl(33.3333%, 100%, 50%) or hsl(120, 255, 127.5) full green
+ hsl(33.3333%, 100%, 25%) or hsl(120, 255, 63.75) dark green
+ hsl(33.3333%, 50%, 50%) or hsl(120, 127.5, 127.5) medium green
+</pre>
+
+<p>One advantage of HSB or HSL over RGB is that it can be more intuitive: you can guess at the colors you want, and then tweak. It is also easier to create sets of matching colors (by keeping the hue the same and varying the brightness or lightness and saturation, for example).</p>