Pillory Barn Logo SVG

by andyjh07

HTML

<svg id="PilloryBarnLogo" data-name="PilloryBarnLogo" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1026 227">
    <defs>
        <style>
            .pillory, .barn {
                fill: #fff;
            }

            .slash {
                fill: #11ccab;
            }
        </style>
    </defs>
    <title>Pillory Barn Logo</title>
    <g class="pillory">
        <animateMotion id="pilloryanim" from="700,0" to="0,0"dur="1.2s"/>
        <path d="M38.16,106.3c8.85,0,13.2-6,13.2-14.33S47,78,38.48,78h-13v28.34ZM0,56.13H43.31c20.29,0,34,14.81,34,35.9,0,20.93-13.68,36.22-34,36.22H25.6v32.2H0Z" />
        <rect x="90.44" y="56.13" width="25.6" height="104.33" />
        <polygon points="130.65 56.13 156.25 56.13 156.25 138.56 198.92 138.56 198.92 160.45 130.65 160.45 130.65 56.13" />
        <polygon points="211.45 56.13 237.05 56.13 237.05 138.56 279.71 138.56 279.71 160.45 211.61 160.45 211.61 56.13 211.45 56.13" />
        <path d="M336.3,138.88c15.62,0,28.17-13.36,28.17-31.23,0-17.07-12.56-29.95-28.17-29.95s-28.17,12.88-28.17,29.95c.16,17.71,12.72,31.23,28.17,31.23m0-84.52c31.56,0,54.58,23.34,54.58,53.29,0,30.59-23,54.58-54.58,54.58s-54.58-24-54.58-54.58c.16-29.95,23.18-53.29,54.58-53.29"
        />
        <path d="M439.06,103.3c8.21,0,13.2-4.51,13.2-12.88,0-7.89-2.9-12.56-15.78-12.56H428V103.3ZM402.36,56.13h36.38c10.63,0,15.78.81,20.29,2.41,11.75,4.51,19.32,15.13,19.32,30.27,0,11.11-5.31,23.18-15.62,28.5v.32a60.93,60.93,0,0,1,3.86,6.28l20.29,36.55h-28.5l-18.51-35.26H428v35.1h-25.6Z"
        />
        <path d="M511.64,117.63l-34.29-61.5h29l11.75,25.12c3.38,7.08,6.28,15,6.28,15h.32s2.9-7.89,6.28-15l11.59-25.12h29l-34.45,61.5v42.82h-25.6V117.63Z" />        
    </g>
    <g class="slash">
        <polygon points="624.67 -0.15 547.87 226.7 571.2 226.7 648 -0.15 624.67 -0.15" />
    </g>
    <g class="barn">
        <animateMotion id="barnanim" from="-700,0" to="0,0" dur="1.2s" begin="-700,0; pilloryanim.end"/>
    ...

SCSS

body {
    background-color: #404041;
}