Wild MISSINGNO appeared! I think is about time to do another Pokemon challenge! Even if Pokémon Go is not as mainstream as it used to be...

The task.

Just draw a MISSINGNO. MISSINGNO is an unofficial Pokémon species found in the video games Pokémon Red and Blue. IGN has noted MISSINGNO appearance in Pokémon Red and Blue as one of the most famous video game glitches.

How MISSINGNO looks like?

This Pokémon is a 3 tiles wide 7 tiles high image of random pixels. Each tile is 8x8 pixels. Considering x as horizontal coordinate which increases from left to right, y as vertical coordinate which increases from top to bottom and [x, y] as coordinate system, the tiles [0, 0], [0, 1] and [0, 2] are blank. The original MISSINGNO appears in Game Boy color roughly as the screenshot below:



Your MISSINGNO.

Your MISSINGNO shoudn't be exactly as the one in the screenshots above, but it should follow this pattern:


Should be formed of 21 tiles, 3 tiles wide 7 tiles high.
Every tile should have at least 9 colors, more than 9 colors is alowed, less is forbidden.
Every tile should have the same pixels in width and in heigth: this is, every tile should be a square.
Every tile should be of the same size, but they can be of any arbitrary size as long as they can show at least 9 colors (a MISSINGNO of 21 tiles of 3x3 pixels is as valid as one with 21 1000x1000 pixels tiles).
Tiles [0, 0], [0, 1] and [0, 2] should be transparent (alpha 0), look at How MISSINGNO looks like? to know the coordinates system.
Transparent means transparent. So any color is acceptable as long as it is completely transparent (alpha 0).
The opaque tiles shall be completely opaques, no transparent or semi-transparent pixels allowed.
Repeated opaque tiles are forbidden.
As long as the tiles follows the rules above, they can be anything: either procedural random pixels tiles or (as an example) pictures from google image search are alowed.


Your output.

Your output should be a image in any format your language supports.


The size of the image should be 3 * tile width wide and 7 * tile height high with no additional pixels alowed. So if you're using 3x3 tiles the image size should be: 9 pixels width and 21 pixels high, with 42x42 tiles the image size should be: 126 pixels width and 294 pixels high.
The ouptut image should be different every program call. Look at Your MISSINGNO to know about the size of the tiles.
The task is to generate the MISSINGNO image, not to show it. So as long as the image is generated the program is valid (but please, upload your results! all of us want to enjoy them!).


Your program.

It can accept a single integer value, this value will be the size of the MISSINGNO tiles.


You can assume that the input will be always possitive and equal to or greater than 3. Look at Your MISSINGNO to know about the size of the tiles.
If no input is provided, the default value is 8.




This is code golf, so the shortest code in bytes win!
JavaScript ES6 + HTML, 148 146 143 137 + 24 22 = 172 170 167 159 bytes

HTML

&lt;canvas id=c&gt;&lt;/canvas&gt;


JavaScript

d=c.getContext`2d`;for(x=0;x&lt;9;x++)for(y=0;y&lt;21;y++)if(x&gt;2||y&gt;8)d.fillStyle='#'+(Math.random()*0xFFF&lt;&lt;0).toString(16),d.fillRect(x,y,1,1)


Saved 8 bytes thanks to ETHproductions.

The image in the snippet has been scaled by 10 pixels to be more visible.



var d = c.getContext`2d`;
for(var x = 0; x &lt; 90; x+=10) {
 for(var y = 0; y &lt; 210; y+=10) {
  if (x &gt; 20 || y &gt; 80) {
   d.fillStyle = '#'+(Math.random()*0xFFF&lt;&lt;0).toString(16);
   d.fillRect(x, y, 10, 10);  
  }
 }
}
&lt;canvas id="c" width="90" height="210"&gt;&lt;/canvas&gt;