Built with blockbuilder.org
xxxxxxxxxx<head> <meta charset="utf-8"> <script src="https://d3js.org/d3.v4.min.js"></script> <style> body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; } </style></head><body> <svg width="500" height="550"> <defs> <pattern id="patHouse" x="0" y="0" width="10" height="50" patternUnits="userSpaceOnUse">> <rect x="0" y="0" width="5" height="50" fill="#452c0b"/> <rect x="5" y="0" width="5" height="50" fill="#352107"/> </pattern> <pattern id="patRoof" x="0" y="0" width="50" height="10" patternUnits="userSpaceOnUse">> <rect x="0" y="0" width="50" height="5" fill="#681800"/> <rect x="0" y="5" width="50" height="5" fill="#4c1100"/> </pattern> <linearGradient id="gradWindow" x1="0%" y1="0%" x2="0%" y2="100%"> <stop offset="50%" stop-color="rgba(10,30,40, .9"/> <stop offset="50%" stop-color="rgba(255,255,255,.2)"/> </linearGradient> <linearGradient id="gradGrass" x1="0%" y1="0%" x2="0%" y2="100%"> <stop offset="20%" stop-color="#063d00"/> <stop offset="100%" stop-color="#00230c" /> </linearGradient> <radialGradient id="gradSky"> <stop offset="10%" stop-color="#2e1947"/> <stop offset="75%" stop-color="#0b091a"/> </radialGradient> <filter id="blurShadow"> <feGaussianBlur in="SourceGraphic" stdDeviation="10" /> </filter> </defs> <symbol id="window" viewBox="0 0 110 110"> <circle cx="55" cy="55" r="50" fill="#efe98e"/> <circle cx="55" cy="55" r="50" stroke-width="5" stroke="#271c10" fill="url(#gradWindow)"/> <rect x="5" y="53" width="100" height="4" fill="#271c10" /> </symbol> <rect id="sky" x="0" y="0" width="500" height="550" fill="url(#gradSky)" /> <path id="grass1" fill="url(#gradGrass)" d="M 0 300 Q 60 240 500 300 L 500 550 L 0 550 Z" /> <rect id="house" x="100" y="200" width="300" height="300" fill="url(#patHouse)" /> <rect id="doorFrame" x="273" y="385" width="80" height="115" fill="#271c10" /> <rect id="door" x="278" y="390" width="70" height="110" fill="#b56b10" /> <circle id="doorKnob" cx="335" cy="450" r="5" fill="#032928" /> <rect x="50" y="200" width="380" height="30" fill="url(#patRoof)" transform="rotate(-2)" /> <use xlink:href="#window" x="260" y="250" width="100" height="100"/> <use xlink:href="#window" x="140" y="280" width="80" height="80"/> <use xlink:href="#window" x="170" y="400" width="60" height="60"/> </svg></body> https://d3js.org/d3.v4.min.js