office-ui-fabric-core/src/documentation/templates/modules/content/DownloadSVG.html

The front-end framework for building experiences for Office 365.

<svg aria-hidden="true" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 832 329.4" focusable="false" tabindex="-1">
  <defs aria-hidden="true">
    <clipPath aria-hidden="true" id="clip-path" transform="translate(0 29.4)">
      <rect aria-hidden="true" x="273" width="304.5" height="281.8" style="fill:none"/>
    </clipPath>
    <clipPath aria-hidden="true" id="clip-path-2" transform="translate(0 29.4)">
      <rect x="379" width="85" height="216" style="fill:none"/>
    </clipPath>
  </defs>
  <title>Download image showing a rainbow exploding out of a zip file becuase fabric is amazing.</title>
  <g id="back" aria-hidden="true">
    <rect y="29.4" width="832" height="300" style="fill:#00b7c3"/>
  </g>
  <g id="Layer_1-2" data-name="Layer 1" aria-hidden="true">
    <g style="opacity:0.6000000238418579" aria-hidden="true">
      <path d="M475.9,278H366.7c-1.6,0-3,1.9-3,3.5s1.3,3.5,3,3.5H475.9c1.6,0,3-1.9,3-3.5S477.5,278,475.9,278Z" transform="translate(0 29.4)" style="fill:#009ca4"/>
    </g>
    <circle cx="422.4" cy="137.1" r="84" style="fill:#61d6d6" aria-hidden="true"/>
    <g style="clip-path:url(#clip-path)" aria-hidden="true">
      <circle aria-hidden="true" cx="422.4" cy="137.1" r="137.1" style="fill:#61d6d6;opacity:0.4000000059604645;isolation:isolate"/>
    </g>
    <polygon aria-hidden="true" points="425.1 228.4 482.6 228.4 463.9 245.4 406.3 245.4 425.1 228.4" style="fill:#f2f2f2"/>
    <g style="clip-path:url(#clip-path-2)" aria-hidden="true">
      <rect aria-hidden="true" x="379" y="29.4" width="22" height="53" style="fill:#ff703a"/>
      <rect aria-hidden="true" x="401" y="29.4" width="21" height="53" style="fill:#ffa800"/>
      <rect aria-hidden="true" x="422" y="29.4" width="22" height="53" style="fill:#ffcb00"/>
      <rect aria-hidden="true" x="444" y="29.4" width="20" height="53" style="fill:#fff048"/>
      <rect aria-hidden="true" x="379" y="82.4" width="22" height="55" style="fill:#d4e34a"/>
      <rect aria-hidden="true" x="401" y="82.4" width="21" height="55" style="fill:#9bcd5f"/>
      <rect aria-hidden="true" x="422" y="82.4" width="22" height="55" style="fill:#63bc66"/>
      <rect aria-hidden="true" x="444" y="82.4" width="20" height="55" style="fill:#19a69a"/>
      <rect aria-hidden="true" x="379" y="137.4" width="22" height="53" style="fill:#0ec6dc"/>
      <rect aria-hidden="true" x="401" y="137.4" width="21" height="53" style="fill:#18b5f9"/>
      <rect aria-hidden="true" x="422" y="137.4" width="22" height="53" style="fill:#3ba3f8"/>
      <rect aria-hidden="true" x="444" y="137.4" width="20" height="53" style="fill:#0075d9"/>
      <rect aria-hidden="true" x="379" y="190.4" width="22" height="59" style="fill:#7e53c5"/>
      <rect aria-hidden="true" x="401" y="190.4" width="21" height="59" style="fill:#ac41be"/>
      <rect aria-hidden="true" x="422" y="190.4" width="22" height="59" style="fill:#ef3c79"/>
      <rect aria-hidden="true" x="444" y="190.4" width="20" height="59" style="fill:#f1524b"/>
    </g>
    <rect aria-hidden="true" x="379" y="245.4" width="85" height="65" style="fill:#e6e6e6"/>
    <rect aria-hidden="true" x="379" y="245.4" width="60" height="65" style="fill:#f2f2f2"/>
    <polygon aria-hidden="true" points="419.8 228.4 362.3 228.4 381 245.4 438.6 245.4 419.8 228.4" style="fill:#ccc"/>
    <rect aria-hidden="true" x="445.7" y="246.4" width="7.2" height="3.9" style="fill:#7a7574"/>
    <rect aria-hidden="true" x="450.5" y="250.2" width="7.2" height="3.4" style="fill:#7a7574"/>
    <rect  aria-hidden="true" x="445.7" y="253.6" width="7.2" height="3.9" style="fill:#7a7574"/>
    <rect  aria-hidden="true" x="450.5" y="257.5" width="7.2" height="3.9" style="fill:#7a7574"/>
    <rect  aria-hidden="true" x="445.7" y="261.3" width="7.2" height="3.9" style="fill:#7a7574"/>
    <rect aria-hidden="true" x="450.5" y="264.7" width="7.2" height="3.9" style="fill:#7a7574"/>
    <rect aria-hidden="true" x="445.7" y="268.6" width="7.2" height="3.9" style="fill:#7a7574"/>
    <rect aria-hidden="true" x="450.5" y="272.4" width="7.2" height="3.9" style="fill:#7a7574"/>
    <text  aria-hidden="true" transform="translate(396.09 282.99)" style="isolation:isolate;font-size:16.072900772094727px;fill:#7a7574;font-family:Segoe Print">ZIP</text>
    <line aria-hidden="true" x1="299.7" y1="64.9" x2="306.5" y2="80.9" style="fill:none;stroke:#61d6d6;stroke-linecap:round;stroke-miterlimit:10;stroke-width:4.753200054168701px"/>
    <line aria-hidden="true" x1="311.1" y1="69.5" x2="295.1" y2="76.3" style="fill:none;stroke:#61d6d6;stroke-linecap:round;stroke-miterlimit:10;stroke-width:4.753200054168701px"/>
    <line aria-hidden="true" x1="302.3" y1="168" x2="301" y2="179.9" style="fill:none;stroke:#61d6d6;stroke-linecap:round;stroke-miterlimit:10;stroke-width:4.753200054168701px"/>
    <line aria-hidden="true" x1="307.6" y1="174.6" x2="295.7" y2="173.3" style="fill:none;stroke:#61d6d6;stroke-linecap:round;stroke-miterlimit:10;stroke-width:4.753200054168701px"/>
    <line aria-hidden="true" x1="547.2" y1="80.6" x2="541.8" y2="97.2" style="fill:none;stroke:#61d6d6;stroke-linecap:round;stroke-miterlimit:10;stroke-width:4.753200054168701px"/>
    <line aria-hidden="true" x1="552.8" y1="91.6" x2="536.2" y2="86.2" style="fill:none;stroke:#61d6d6;stroke-linecap:round;stroke-miterlimit:10;stroke-width:4.753200054168701px"/>
    <line aria-hidden="true" x1="378.5" y1="125" x2="385.3" y2="141" style="fill:none;stroke:#fff;stroke-linecap:round;stroke-miterlimit:10;stroke-width:4.753200054168701px"/>
    <line aria-hidden="true" x1="389.9" y1="129.6" x2="373.9" y2="136.4" style="fill:none;stroke:#fff;stroke-linecap:round;stroke-miterlimit:10;stroke-width:4.753200054168701px"/>
    <line aria-hidden="true" x1="385.3" y1="125" x2="378.5" y2="141" style="fill:none;stroke:#fff;stroke-linecap:round;stroke-miterlimit:10;stroke-width:4.753200054168701px"/>
    <line aria-hidden="true" x1="389.9" y1="136.4" x2="373.9" y2="129.6" style="fill:none;stroke:#fff;stroke-linecap:round;stroke-miterlimit:10;stroke-width:4.753200054168701px"/>
    <line aria-hidden="true" x1="476.5" y1="167.7" x2="483.6" y2="177.3" style="fill:none;stroke:#fff;stroke-linecap:round;stroke-miterlimit:10;stroke-width:4.753200054168701px"/>
    <line aria-hidden="true" x1="484.8" y1="169" x2="475.3" y2="176.1" style="fill:none;stroke:#fff;stroke-linecap:round;stroke-miterlimit:10;stroke-width:4.753200054168701px"/>
    <circle  aria-hidden="true" cx="345.3" cy="98.7" r="3.7" style="fill:#fff"/>
    <circle aria-hidden="true" cx="487.8" cy="49.6" r="3.7" style="fill:#fff"/>
    <circle aria-hidden="true" cx="431.1" cy="190" r="3.7" style="fill:#fff"/>
    <circle aria-hidden="true" cx="513" cy="148.1" r="3.7" style="fill:#fff"/>
    <g  aria-hidden="true" style="opacity:0.4000000059604645">
      <rect aria-hidden="true" x="163" y="40.4" width="6" height="18" style="fill:#fff"/>
      <rect aria-hidden="true" x="163" y="58.4" width="6" height="18" style="fill:#f2f2f2"/>
      <rect aria-hidden="true" x="163" y="76.4" width="6" height="16" style="fill:#e6e6e6"/>
      <rect aria-hidden="true" x="163" y="92.4" width="6" height="18" style="fill:#ccc"/>
    </g>
    <g aria-hidden="true" style="opacity:0.4000000059604645">
      <rect aria-hidden="true" x="224" y="105.4" width="5" height="16" style="fill:#fff"/>
      <rect aria-hidden="true" x="224" y="121.4" width="5" height="17" style="fill:#f2f2f2"/>
      <rect aria-hidden="true" x="224" y="138.4" width="5" height="18" style="fill:#e6e6e6"/>
      <rect aria-hidden="true" x="224" y="156.4" width="5" height="18" style="fill:#ccc"/>
    </g>
    <g aria-hidden="true" style="opacity:0.4000000059604645">
      <rect aria-hidden="true" x="648" y="29.4" width="6" height="40" style="fill:#fff"/>
      <rect aria-hidden="true" x="648" y="69.4" width="6" height="45" style="fill:#f2f2f2"/>
      <rect aria-hidden="true"t x="648" y="114.4" width="6" height="41" style="fill:#e6e6e6"/>
      <rect aria-hidden="true" x="648" y="155.4" width="6" height="45" style="fill:#ccc"/>
    </g>
    <g aria-hidden="true" style="opacity:0.4000000059604645">
      <rect aria-hidden="true" x="199" y="29.4" width="7" height="40" style="fill:#fff"/>
      <rect aria-hidden="true" x="199" y="69.4" width="7" height="45" style="fill:#f2f2f2"/>
      <rect aria-hidden="true" x="199" y="114.4" width="7" height="41" style="fill:#e6e6e6"/>
      <rect aria-hidden="true" x="199" y="155.4" width="7" height="45" style="fill:#ccc"/>
    </g>
    <g aria-hidden="true" style="opacity:0.4000000059604645">
      <rect aria-hidden="true" x="605" y="174.4" width="6" height="16" style="fill:#fff"/>
      <rect aria-hidden="true" x="605" y="190.4" width="6" height="19" style="fill:#f2f2f2"/>
      <rect aria-hidden="true" x="605" y="209.4" width="6" height="16" style="fill:#e6e6e6"/>
      <rect aria-hidden="true" x="605" y="225.4" width="6" height="19" style="fill:#ccc"/>
    </g>
  </g>
</svg>