NGW Code Dojo

dojo-challenge.md

Never Graduate Week Code Dojo

Write a program that draws the Recurse Center logo (or a variant/approximation/shitty version of it)!

You can draw in a terminal in ASCII art, in a web browser, generate an actual image, or any other way you want. Be creative :-) Any language allowed.

logo.svg

<!-- When you edit this file, make sure to bump the version in assets.es6.erb -->
<svg class="rc-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 15">
  <rect class="rc-logo__primary" x="0" y="0" width="12" height="1" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="0" y="0" width="1" height="10" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="11" y="0" width="1" height="10" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="0" y="9" width="12" height="1" fill="#2a2d2d"/>

  <rect class="rc-logo__primary" x="4" y="9" width="4" height="3" fill="#2a2d2d"/>

  <rect class="rc-logo__primary" x="1" y="11" width="10" height="1" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="1" y="11" width="1" height="4" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="10" y="11" width="1" height="4" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="1" y="14" width="10" height="1" fill="#2a2d2d"/>

  <rect class="rc-logo__primary" x="0" y="12" width="2" height="3" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="10" y="12" width="2" height="3" fill="#2a2d2d"/>

  <rect class="rc-logo__primary" x="10" y="12" width="2" height="3" fill="#2a2d2d"/>

  <rect class="rc-logo__primary" x="1" y="11" width="2" height="2" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="4" y="11" width="1" height="2" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="6" y="11" width="1" height="2" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="8" y="11" width="1" height="2" fill="#2a2d2d"/>

  <rect class="rc-logo__primary" x="9" y="13" width="2" height="2" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="7" y="13" width="1" height="2" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="5" y="13" width="1" height="2" fill="#2a2d2d"/>
  <rect class="rc-logo__primary" x="3" y="13" width="1" height="2" fill="#2a2d2d"/>

  <rect class="rc-logo__secondary" x="1" y="1" width="10" height="8" fill="#fff"/>
  <rect class="rc-logo__secondary" x="2" y="13" width="1" height="1" fill="#fff"/>
  <rect class="rc-logo__secondary" x="3" y="12" width="1" height="1" fill="#fff"/>
  <rect class="rc-logo__secondary" x="4" y="13" width="1" height="1" fill="#fff"/>
  <rect class="rc-logo__secondary" x="5" y="12" width="1" height="1" fill="#fff"/>
  <rect class="rc-logo__secondary" x="6" y="13" width="1" height="1" fill="#fff"/>
  <rect class="rc-logo__secondary" x="7" y="12" width="1" height="1" fill="#fff"/>
  <rect class="rc-logo__secondary" x="8" y="13" width="1" height="1" fill="#fff"/>
  <rect class="rc-logo__secondary" x="9" y="12" width="1" height="1" fill="#fff"/>

  <rect class="rc-logo__primary" x="2" y="2" width="8" height="6" fill="#2a2d2d"/>

  <rect class="rc-logo__accent rc-logo__pixel1" x="2" y="3" width="1" height="1" fill="#3dc06c"/>
  <rect class="rc-logo__accent rc-logo__pixel2" x="4" y="3" width="1" height="1" fill="#3dc06c"/>
  <rect class="rc-logo__accent rc-logo__pixel3" x="6" y="3" width="1" height="1" fill="#3dc06c"/>
  <rect class="rc-logo__accent rc-logo__pixel4" x="3" y="5" width="2" height="1" fill="#3dc06c"/>
  <rect class="rc-logo__accent rc-logo__pixel5" x="6" y="5" width="2" height="1" fill="#3dc06c"/>
</svg>