1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16

<input id="ad" type="radio" name="a" value="a"/>
<label for="ad">Default</label>
<input id="ared" type="radio" name="a" value="b" data="red"/>
<label for="ared">Red</label>
<input id="apink" type="radio" name="a" value="c" data="pink"/>
<label for="apink">Pink</label>
<input id="apurple" type="radio" name="a" value="d" data="purple"/>
<label for="apurple">Purple</label>
<input id="ablue" type="radio" name="a" value="e" data="blue"/>
<label for="ablue">Blue</label>
<input id="agreen" type="radio" name="a" value="f" data="green"/>
<label for="agreen">Green</label>
<input id="ayellow" type="radio" name="a" value="g" data="yellow"/>
<label for="ayellow">Yellow</label>
<input id="aorange" type="radio" name="a" value="h" data="orange"/>
<label for="aorange">Orange</label>

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16

<input id="bd" type="radio" name="b" value="a" data="plain"/>
<label for="bd">Default</label>
<input id="bred" type="radio" name="b" value="b" data="red plain"/>
<label for="bred">Red</label>
<input id="bpink" type="radio" name="b" value="c" data="pink plain"/>
<label for="bpink">Pink</label>
<input id="bpurple" type="radio" name="b" value="d" data="purple plain"/>
<label for="bpurple">Purple</label>
<input id="bblue" type="radio" name="b" value="e" data="plain blue"/>
<label for="bblue">Blue</label>
<input id="bgreen" type="radio" name="b" value="f" data="green plain"/>
<label for="bgreen">Green</label>
<input id="byellow" type="radio" name="b" value="g" data="yellow plain"/>
<label for="byellow">Yellow</label>
<input id="borange" type="radio" name="b" value="h" data="orange plain"/>
<label for="borange">Orange</label>

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16

<input id="cd" type="radio" name="c" value="a" data="fill"/>
<label for="cd">Default</label>
<input id="cred" type="radio" name="c" value="b" data="red fill"/>
<label for="cred">Red</label>
<input id="cpink" type="radio" name="c" value="c" data="pink fill"/>
<label for="cpink">Pink</label>
<input id="cpurple" type="radio" name="c" value="d" data="purple fill"/>
<label for="cpurple">Purple</label>
<input id="cblue" type="radio" name="c" value="e" data="blue fill"/>
<label for="cblue">Blue</label>
<input id="cgreen" type="radio" name="c" value="f" data="fill green"/>
<label for="cgreen">Green</label>
<input id="cyellow" type="radio" name="c" value="g" data="yellow fill"/>
<label for="cyellow">Yellow</label>
<input id="corange" type="radio" name="c" value="h" data="orange fill"/>
<label for="corange">Orange</label>

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16

<input id="dd" type="radio" name="d" value="a" data="fill plain"/>
<label for="dd">Default</label>
<input id="dred" type="radio" name="d" value="b" data="red fill plain"/>
<label for="dred">Red</label>
<input id="dpink" type="radio" name="d" value="c" data="pink fill plain"/>
<label for="dpink">Pink</label>
<input id="dpurple" type="radio" name="d" value="d" data="purple plain fill"/>
<label for="dpurple">Purple</label>
<input id="dblue" type="radio" name="d" value="e" data="plain blue fill"/>
<label for="dblue">Blue</label>
<input id="dgreen" type="radio" name="d" value="f" data="fill green plain"/>
<label for="dgreen">Green</label>
<input id="dyellow" type="radio" name="d" value="g" data="fill plain yellow"/>
<label for="dyellow">Yellow</label>
<input id="dorange" type="radio" name="d" value="h" data="plain fill orange"/>
<label for="dorange">Orange</label>

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

<input id="zd" type="checkbox" name="a"/>
<label for="zd">Default</label>
<input id="zred" type="checkbox" name="b" data="red"/>
<label for="zred">Red</label>
<input id="zpink" type="checkbox" name="c" data="pink plain"/>
<label for="zpink">Pink plain</label>
<input id="zpurple" type="checkbox" name="d" data="purple fill"/>
<label for="zpurple">Purple fill</label>
<input id="zblue" type="checkbox" name="e" data="blue plain fill"/>
<label for="zblue">Blue plain fill</label>