diff --git a/img/holepatern.png b/img/holepatern.png
new file mode 100644
index 0000000..5ec8385
Binary files /dev/null and b/img/holepatern.png differ
diff --git a/src/d2/Shape.js b/src/d2/Shape.js
index 868ed4f..6fdc9e3 100644
--- a/src/d2/Shape.js
+++ b/src/d2/Shape.js
@@ -5,6 +5,13 @@ import { LINE_WIDTH } from '../constants/d2Constants.js';
 import { hexToStyle } from '../utils/colorUtils.js';
 import { DESELECT_TRANSPARENCY, FILL_TRANSPARENCY, LINE_TRANSPARENCY } from '../constants/d2Constants.js';
 import { PIXEL_RATIO } from '../constants/general.js';
+import holePaternUrl from '../../img/holepatern.png';
+import { loadImage } from '../utils/imageUtils.js';
+
+let holePatern;
+loadImage(holePaternUrl).then(image => {
+  holePatern =  document.createElement('canvas').getContext('2d').createPattern(image, 'repeat')
+});
 
 export default class Shape extends Matrix {
   constructor(shapeData) {
@@ -94,7 +101,10 @@ export default class Shape extends Matrix {
     const lineWidth = PIXEL_RATIO * LINE_WIDTH;
 
     context.globalAlpha = this.alpha;
-    if (this._shapeData.fill) {
+    if (!this._shapeData.solid) {
+      context.fillStyle = holePatern;
+      context.fill();
+    } else if (this._shapeData.fill) {
       context.fillStyle = this.color;
       context.fill();