- https://codepen.io/ (moving on to visualization)
- click start coding
- copy my html code:
<svg style............(delete this space)...................
.....="background: lime; width:16px; height:18px;">
<rect x="5" y="1" width="1" height="1"fill="red">
<rect x="6" y="1" width="1" height="1"fill="red">
<rect x="7" y="1" width="1" height="1"fill="red">
<rect x="8" y="1" width="1" height="1"fill="red">
<rect x="9" y="1" width="1" height="1"fill="red">
<rect x="4" y="2" width="1" height="1"fill="red">
<rect x="5" y="2" width="1" height="1"fill="red">
<rect x="6" y="2" width="1" height="1"fill="red">
<rect x="7" y="2" width="1" height="1"fill="red">
<rect x="8" y="2" width="1" height="1"fill="red">
<rect x="9" y="2" width="1" height="1"fill="red">
<rect x="10" y="2" width="1" height="1"fill="red">
<rect x="11" y="2" width="1" height="1"fill="red">
<rect x="12" y="2" width="1" height="1"fill="red">
<rect x="4" y="3" width="1" height="1"fill="black">
<rect x="5" y="3" width="1" height="1"fill="black">
<rect x="6" y="3" width="1" height="1"fill="black">
<rect x="7" y="3" width="1" height="1"fill="Bisque">
<rect x="8" y="3" width="1" height="1"fill="Bisque">
<rect x="9" y="3" width="1" height="1"fill="black">
<rect x="10" y="3" width="1" height="1"fill="Bisque">
<rect x="3" y="4" width="1" height="1"fill="black">
<rect x="4" y="4" width="1" height="1"fill="Bisque">
<rect x="5" y="4" width="1" height="1"fill="black">
<rect x="6" y="4" width="1" height="1"fill="Bisque">
<rect x="7" y="4" width="1" height="1"fill="Bisque">
<rect x="8" y="4" width="1" height="1"fill="Bisque">
<rect x="9" y="4" width="1" height="1"fill="black">
<rect x="10" y="4" width="1" height="1"fill="Bisque">
<rect x="11" y="4" width="1" height="1"fill="Bisque">
<rect x="12" y="4" width="1" height="1"fill="Bisque">
<rect x="3" y="5" width="1" height="1"fill="black">
<rect x="4" y="5" width="1" height="1"fill="Bisque">
<rect x="5" y="5" width="1" height="1"fill="black">
<rect x="6" y="5" width="1" height="1"fill="black">
<rect x="7" y="5" width="1" height="1"fill="Bisque">
<rect x="8" y="5" width="1" height="1"fill="Bisque">
<rect x="9" y="5" width="1" height="1"fill="Bisque">
<rect x="10" y="5" width="1" height="1"fill="black">
<rect x="11" y="5" width="1" height="1"fill="Bisque">
<rect x="12" y="5" width="1" height="1"fill="Bisque">
<rect x="13" y="5" width="1" height="1"fill="Bisque">
<rect x="3" y="6" width="1" height="1"fill="black">
<rect x="4" y="6" width="1" height="1"fill="black">
<rect x="5" y="6" width="1" height="1"fill="Bisque">
<rect x="6" y="6" width="1" height="1"fill="Bisque">
<rect x="7" y="6" width="1" height="1"fill="Bisque">
<rect x="8" y="6" width="1" height="1"fill="Bisque">
<rect x="9" y="6" width="1" height="1"fill="black">
<rect x="10" y="6" width="1" height="1"fill="black">
<rect x="11" y="6" width="1" height="1"fill="black">
<rect x="12" y="6" width="1" height="1"fill="black">
<rect x="5" y="7" width="1" height="1"fill="Bisque">
<rect x="6" y="7" width="1" height="1"fill="Bisque">
<rect x="7" y="7" width="1" height="1"fill="Bisque">
<rect x="8" y="7" width="1" height="1"fill="Bisque">
<rect x="9" y="7" width="1" height="1"fill="Bisque">
<rect x="10" y="7" width="1" height="1"fill="Bisque">
<rect x="11" y="7" width="1" height="1"fill="Bisque">
<rect x="4" y="8" width="1" height="1"fill="blue">
<rect x="5" y="8" width="1" height="1"fill="blue">
<rect x="6" y="8" width="1" height="1"fill="red">
<rect x="7" y="8" width="1" height="1"fill="blue">
<rect x="8" y="8" width="1" height="1"fill="blue">
<rect x="9" y="8" width="1" height="1"fill="blue">
<rect x="3" y="9" width="1" height="1"fill="blue">
<rect x="4" y="9" width="1" height="1"fill="blue">
<rect x="5" y="9" width="1" height="1"fill="blue">
<rect x="6" y="9" width="1" height="1"fill="red">
<rect x="7" y="9" width="1" height="1"fill="blue">
<rect x="8" y="9" width="1" height="1"fill="blue">
<rect x="9" y="9" width="1" height="1"fill="red">
<rect x="10" y="9" width="1" height="1"fill="blue">
<rect x="11" y="9" width="1" height="1"fill="blue">
<rect x="12" y="9" width="1" height="1"fill="blue">
<rect x="2" y="10" width="1" height="1"fill="blue">
<rect x="3" y="10" width="1" height="1"fill="blue">
<rect x="4" y="10" width="1" height="1"fill="blue">
<rect x="5" y="10" width="1" height="1"fill="blue">
<rect x="6" y="10" width="1" height="1"fill="red">
<rect x="7" y="10" width="1" height="1"fill="blue">
<rect x="8" y="10" width="1" height="1"fill="blue">
<rect x="9" y="10" width="1" height="1"fill="red">
<rect x="10" y="10" width="1" height="1"fill="blue">
<rect x="11" y="10" width="1" height="1"fill="blue">
<rect x="12" y="10" width="1" height="1"fill="blue">
<rect x="13" y="10" width="1" height="1"fill="blue">
<rect x="2" y="11" width="1" height="1"fill="Bisque">
<rect x="3" y="11" width="1" height="1"fill="Bisque">
<rect x="4" y="11" width="1" height="1"fill="blue">
<rect x="5" y="11" width="1" height="1"fill="blue">
<rect x="6" y="11" width="1" height="1"fill="red">
<rect x="7" y="11" width="1" height="1"fill="red">
<rect x="8" y="11" width="1" height="1"fill="red">
<rect x="9" y="11" width="1" height="1"fill="red">
<rect x="10" y="11" width="1" height="1"fill="blue">
<rect x="11" y="11" width="1" height="1"fill="blue">
<rect x="12" y="11" width="1" height="1"fill="Bisque">
<rect x="13" y="11" width="1" height="1"fill="Bisque">
<rect x="2" y="12" width="1" height="1"fill="Bisque">
<rect x="3" y="12" width="1" height="1"fill="Bisque">
<rect x="4" y="12" width="1" height="1"fill="Bisque">
<rect x="5" y="12" width="1" height="1"fill="red">
<rect x="6" y="12" width="1" height="1"fill="Yellow">
<rect x="7" y="12" width="1" height="1"fill="red">
<rect x="8" y="12" width="1" height="1"fill="red">
<rect x="9" y="12" width="1" height="1"fill="Yellow">
<rect x="10" y="12" width="1" height="1"fill="red">
<rect x="11" y="12" width="1" height="1"fill="Bisque">
<rect x="12" y="12" width="1" height="1"fill="Bisque">
<rect x="13" y="12" width="1" height="1"fill="Bisque">
<rect x="2" y="13" width="1" height="1"fill="Bisque">
<rect x="3" y="13" width="1" height="1"fill="Bisque">
<rect x="4" y="13" width="1" height="1"fill="red">
<rect x="5" y="13" width="1" height="1"fill="red">
<rect x="6" y="13" width="1" height="1"fill="red">
<rect x="7" y="13" width="1" height="1"fill="red">
<rect x="8" y="13" width="1" height="1"fill="red">
<rect x="9" y="13" width="1" height="1"fill="red">
<rect x="10" y="13" width="1" height="1"fill="red">
<rect x="11" y="13" width="1" height="1"fill="red">
<rect x="12" y="13" width="1" height="1"fill="Bisque">
<rect x="13" y="13" width="1" height="1"fill="Bisque">
<rect x="4" y="14" width="1" height="1"fill="red">
<rect x="5" y="14" width="1" height="1"fill="red">
<rect x="6" y="14" width="1" height="1"fill="red">
<rect x="9" y="14" width="1" height="1"fill="red">
<rect x="10" y="14" width="1" height="1"fill="red">
<rect x="11" y="14" width="1" height="1"fill="red">
<rect x="3" y="15" width="1" height="1"fill="SaddleBrown">
<rect x="4" y="15" width="1" height="1"fill="SaddleBrown">
<rect x="5" y="15" width="1" height="1"fill="SaddleBrown">
<rect x="10" y="15" width="1" height="1"fill="SaddleBrown">
<rect x="11" y="15" width="1" height="1"fill="SaddleBrown">
<rect x="12" y="15" width="1" height="1"fill="SaddleBrown">
<rect x="2" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="3" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="4" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="5" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="10" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="11" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="12" y="16" width="1" height="1"fill="SaddleBrown">
<rect x="13" y="16" width="1" height="1"fill="SaddleBrown">
- paste into the html window
- rejoice :)