examples/tiny-grids.svg

<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='393' width='152' font-family='Menlo,Lucida Console,monospace'>
<style type="text/css">
svg {
   color: #000000;
}
@media (prefers-color-scheme: dark) {
   svg {
      color-scheme: dark; /* ask the browser for a dark background */
      color: #FFFFFF;
   }
}
</style>
<g transform='translate(8,16)'>
<path d='M 24,288 L 40,288' fill='none' stroke='currentColor'></path>
<path d='M 40,288 L 56,288' fill='none' stroke='currentColor'></path>
<path d='M 56,288 L 72,288' fill='none' stroke='currentColor'></path>
<path d='M 72,288 L 88,288' fill='none' stroke='currentColor'></path>
<path d='M 24,304 L 40,304' fill='none' stroke='currentColor'></path>
<path d='M 40,304 L 56,304' fill='none' stroke='currentColor'></path>
<path d='M 56,304 L 72,304' fill='none' stroke='currentColor'></path>
<path d='M 72,304 L 88,304' fill='none' stroke='currentColor'></path>
<path d='M 24,320 L 40,320' fill='none' stroke='currentColor'></path>
<path d='M 40,320 L 56,320' fill='none' stroke='currentColor'></path>
<path d='M 56,320 L 72,320' fill='none' stroke='currentColor'></path>
<path d='M 72,320 L 88,320' fill='none' stroke='currentColor'></path>
<path d='M 24,336 L 40,336' fill='none' stroke='currentColor'></path>
<path d='M 40,336 L 56,336' fill='none' stroke='currentColor'></path>
<path d='M 56,336 L 72,336' fill='none' stroke='currentColor'></path>
<path d='M 72,336 L 88,336' fill='none' stroke='currentColor'></path>
<path d='M 24,352 L 40,352' fill='none' stroke='currentColor'></path>
<path d='M 40,352 L 56,352' fill='none' stroke='currentColor'></path>
<path d='M 56,352 L 72,352' fill='none' stroke='currentColor'></path>
<path d='M 72,352 L 88,352' fill='none' stroke='currentColor'></path>
<path d='M 8,200 L 104,200' fill='none' stroke='currentColor'></path>
<path d='M 8,216 L 32,216' fill='none' stroke='currentColor'></path>
<path d='M 32,216 L 56,216' fill='none' stroke='currentColor'></path>
<path d='M 56,216 L 80,216' fill='none' stroke='currentColor'></path>
<path d='M 80,216 L 104,216' fill='none' stroke='currentColor'></path>
<path d='M 8,232 L 32,232' fill='none' stroke='currentColor'></path>
<path d='M 32,232 L 56,232' fill='none' stroke='currentColor'></path>
<path d='M 56,232 L 80,232' fill='none' stroke='currentColor'></path>
<path d='M 80,232 L 104,232' fill='none' stroke='currentColor'></path>
<path d='M 8,248 L 32,248' fill='none' stroke='currentColor'></path>
<path d='M 32,248 L 56,248' fill='none' stroke='currentColor'></path>
<path d='M 56,248 L 80,248' fill='none' stroke='currentColor'></path>
<path d='M 80,248 L 104,248' fill='none' stroke='currentColor'></path>
<path d='M 8,264 L 32,264' fill='none' stroke='currentColor'></path>
<path d='M 32,264 L 56,264' fill='none' stroke='currentColor'></path>
<path d='M 56,264 L 80,264' fill='none' stroke='currentColor'></path>
<path d='M 80,264 L 104,264' fill='none' stroke='currentColor'></path>
<path d='M 8,208 L 8,256' fill='none' stroke='currentColor'></path>
<path d='M 24,288 L 24,304' fill='none' stroke='currentColor'></path>
<path d='M 24,304 L 24,320' fill='none' stroke='currentColor'></path>
<path d='M 24,320 L 24,336' fill='none' stroke='currentColor'></path>
<path d='M 24,336 L 24,352' fill='none' stroke='currentColor'></path>
<path d='M 32,208 L 32,256' fill='none' stroke='currentColor'></path>
<path d='M 40,288 L 40,304' fill='none' stroke='currentColor'></path>
<path d='M 40,304 L 40,320' fill='none' stroke='currentColor'></path>
<path d='M 40,320 L 40,336' fill='none' stroke='currentColor'></path>
<path d='M 40,336 L 40,352' fill='none' stroke='currentColor'></path>
<path d='M 56,208 L 56,256' fill='none' stroke='currentColor'></path>
<path d='M 56,288 L 56,304' fill='none' stroke='currentColor'></path>
<path d='M 56,304 L 56,320' fill='none' stroke='currentColor'></path>
<path d='M 56,320 L 56,336' fill='none' stroke='currentColor'></path>
<path d='M 56,336 L 56,352' fill='none' stroke='currentColor'></path>
<path d='M 72,288 L 72,304' fill='none' stroke='currentColor'></path>
<path d='M 72,304 L 72,320' fill='none' stroke='currentColor'></path>
<path d='M 72,320 L 72,336' fill='none' stroke='currentColor'></path>
<path d='M 72,336 L 72,352' fill='none' stroke='currentColor'></path>
<path d='M 80,208 L 80,256' fill='none' stroke='currentColor'></path>
<path d='M 88,288 L 88,304' fill='none' stroke='currentColor'></path>
<path d='M 88,304 L 88,320' fill='none' stroke='currentColor'></path>
<path d='M 88,320 L 88,336' fill='none' stroke='currentColor'></path>
<path d='M 88,336 L 88,352' fill='none' stroke='currentColor'></path>
<path d='M 104,208 L 104,256' fill='none' stroke='currentColor'></path>
<path d='M 120,16 L 120,352' fill='none' stroke='currentColor'></path>
<path d='M 8,200 L 8,208' fill='none' stroke='currentColor'></path>
<path d='M 8,256 L 8,264' fill='none' stroke='currentColor'></path>
<path d='M 32,200 L 32,208' fill='none' stroke='currentColor'></path>
<path d='M 32,256 L 32,264' fill='none' stroke='currentColor'></path>
<path d='M 56,200 L 56,208' fill='none' stroke='currentColor'></path>
<path d='M 56,256 L 56,264' fill='none' stroke='currentColor'></path>
<path d='M 80,200 L 80,208' fill='none' stroke='currentColor'></path>
<path d='M 80,256 L 80,264' fill='none' stroke='currentColor'></path>
<path d='M 104,200 L 104,208' fill='none' stroke='currentColor'></path>
<path d='M 104,256 L 104,264' fill='none' stroke='currentColor'></path>
<style>
  text {
       text-anchor: middle;
       font-family: "Menlo","Lucida Console","monospace";
       fill: currentColor;
       font-size: 1em;
  }
</style>
<text x='0' y='4'>0</text>
<text x='8' y='4'>1</text>
<text x='16' y='4'>2</text>
<text x='24' y='4'>3</text>
<text x='32' y='4'>4</text>
<text x='40' y='4'>5</text>
<text x='48' y='4'>6</text>
<text x='56' y='4'>7</text>
<text x='64' y='4'>8</text>
<text x='72' y='4'>9</text>
<text x='80' y='4'>0</text>
<text x='88' y='4'>1</text>
<text x='96' y='4'>2</text>
<text x='104' y='4'>3</text>
<text x='112' y='4'>4</text>
<text x='120' y='4'>5</text>
<text x='8' y='20'>┌</text>
<text x='16' y='20'>─</text>
<text x='24' y='20'>┬</text>
<text x='32' y='20'>─</text>
<text x='40' y='20'>┬</text>
<text x='48' y='20'>─</text>
<text x='56' y='20'>┬</text>
<text x='64' y='20'>─</text>
<text x='72' y='20'>┬</text>
<text x='80' y='20'>─</text>
<text x='88' y='20'>┐</text>
<text x='8' y='36'>├</text>
<text x='16' y='36'>─</text>
<text x='24' y='36'>┼</text>
<text x='32' y='36'>─</text>
<text x='40' y='36'>┼</text>
<text x='48' y='36'>─</text>
<text x='56' y='36'>┼</text>
<text x='64' y='36'>─</text>
<text x='72' y='36'>┼</text>
<text x='80' y='36'>─</text>
<text x='88' y='36'>┤</text>
<text x='8' y='52'>├</text>
<text x='16' y='52'>─</text>
<text x='24' y='52'>┼</text>
<text x='32' y='52'>─</text>
<text x='40' y='52'>┼</text>
<text x='48' y='52'>─</text>
<text x='56' y='52'>┼</text>
<text x='64' y='52'>─</text>
<text x='72' y='52'>┼</text>
<text x='80' y='52'>─</text>
<text x='88' y='52'>┤</text>
<text x='8' y='68'>├</text>
<text x='16' y='68'>─</text>
<text x='24' y='68'>┼</text>
<text x='32' y='68'>─</text>
<text x='40' y='68'>┼</text>
<text x='48' y='68'>─</text>
<text x='56' y='68'>┼</text>
<text x='64' y='68'>─</text>
<text x='72' y='68'>┼</text>
<text x='80' y='68'>─</text>
<text x='88' y='68'>┤</text>
<text x='8' y='84'>└</text>
<text x='16' y='84'>─</text>
<text x='24' y='84'>┴</text>
<text x='32' y='84'>─</text>
<text x='40' y='84'>┴</text>
<text x='48' y='84'>─</text>
<text x='56' y='84'>┴</text>
<text x='64' y='84'>─</text>
<text x='72' y='84'>┴</text>
<text x='80' y='84'>─</text>
<text x='88' y='84'>┘</text>
<text x='16' y='116'>┌</text>
<text x='24' y='116'>┬</text>
<text x='32' y='116'>┬</text>
<text x='40' y='116'>┬</text>
<text x='48' y='116'>┬</text>
<text x='56' y='116'>┬</text>
<text x='64' y='116'>┬</text>
<text x='72' y='116'>┬</text>
<text x='80' y='116'>┬</text>
<text x='88' y='116'>┐</text>
<text x='16' y='132'>├</text>
<text x='24' y='132'>┼</text>
<text x='32' y='132'>┼</text>
<text x='40' y='132'>┼</text>
<text x='48' y='132'>┼</text>
<text x='56' y='132'>┼</text>
<text x='64' y='132'>┼</text>
<text x='72' y='132'>┼</text>
<text x='80' y='132'>┼</text>
<text x='88' y='132'>┤</text>
<text x='16' y='148'>├</text>
<text x='24' y='148'>┼</text>
<text x='32' y='148'>┼</text>
<text x='40' y='148'>┼</text>
<text x='48' y='148'>┼</text>
<text x='56' y='148'>┼</text>
<text x='64' y='148'>┼</text>
<text x='72' y='148'>┼</text>
<text x='80' y='148'>┼</text>
<text x='88' y='148'>┤</text>
<text x='16' y='164'>├</text>
<text x='24' y='164'>┼</text>
<text x='32' y='164'>┼</text>
<text x='40' y='164'>┼</text>
<text x='48' y='164'>┼</text>
<text x='56' y='164'>┼</text>
<text x='64' y='164'>┼</text>
<text x='72' y='164'>┼</text>
<text x='80' y='164'>┼</text>
<text x='88' y='164'>┤</text>
<text x='16' y='180'>└</text>
<text x='24' y='180'>┴</text>
<text x='32' y='180'>┴</text>
<text x='40' y='180'>┴</text>
<text x='48' y='180'>┴</text>
<text x='56' y='180'>┴</text>
<text x='64' y='180'>┴</text>
<text x='72' y='180'>┴</text>
<text x='80' y='180'>┴</text>
<text x='88' y='180'>┘</text>
<text x='0' y='372'>0</text>
<text x='8' y='372'>1</text>
<text x='16' y='372'>2</text>
<text x='24' y='372'>3</text>
<text x='32' y='372'>4</text>
<text x='40' y='372'>5</text>
<text x='48' y='372'>6</text>
<text x='56' y='372'>7</text>
<text x='64' y='372'>8</text>
<text x='72' y='372'>9</text>
<text x='80' y='372'>0</text>
<text x='88' y='372'>1</text>
<text x='96' y='372'>2</text>
<text x='104' y='372'>3</text>
<text x='112' y='372'>4</text>
<text x='120' y='372'>5</text>
</g>
</svg>