Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource

JavaScript

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Behavior

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                <div id="wrapper">  

<svg id="fashion_svg" x="0px" y="0px" viewBox="0 0 375 126">
                          <defs>
                            <clipPath id="mask_1_">
                              <path class="cls-1" d="M127.86,53.45a3,3,0,0,0-1.72-.49,2.08,2.08,0,0,0-1.89.93q-3.16,6-6,10.76a76.68,76.68,0,0,1-5,7.4q-2.63,3.38-4.15,3.4-.57,0-1.27-2.62a35.51,35.51,0,0,1-.95-6.94,66.59,66.59,0,0,1,.25-9.79,51.74,51.74,0,0,1,2.33-11.17q.36-1.29-3.08-2.28a23.78,23.78,0,0,0-6.87-.94,12.22,12.22,0,0,0-2.85.36,3.2,3.2,0,0,0-1.89,1.12,8.68,8.68,0,0,1-.74,1.3,15.82,15.82,0,0,0-4.79-1.61,40.25,40.25,0,0,0-8-.54,32.92,32.92,0,0,0-12.07,2.28A31.66,31.66,0,0,0,60,50.11a24.29,24.29,0,0,0-5.81,7.48,17.58,17.58,0,0,0-2,8q.09,7,3.86,10.77t11.58,3.72a11.26,11.26,0,0,0,6.16-2.14A39.46,39.46,0,0,0,80,72.66a59.91,59.91,0,0,0,5.91-7.16q2.81-4,5-7.6-.17,1.55-.25,3t-.06,2.83a26.66,26.66,0,0,0,.84,6,17.57,17.57,0,0,0,2.75,6,16.12,16.12,0,0,0,5,4.57A14.38,14.38,0,0,0,106.9,82a5.84,5.84,0,0,0,3.22-1.2A24.86,24.86,0,0,0,113.51,78a34.56,34.56,0,0,0,3.28-3.84q1.59-2.14,3.83-5.78,3.73-5.84,7.63-13.49A1,1,0,0,0,127.86,53.45ZM83,62.06a56.22,56.22,0,0,1-4.21,5.53,28.91,28.91,0,0,1-4.23,4,6.64,6.64,0,0,1-3.79,1.59,2.57,2.57,0,0,1-1.82-.81,4.18,4.18,0,0,1-.9-3,21.48,21.48,0,0,1,1.6-8.71,30.9,30.9,0,0,1,3.91-6.87,19.39,19.39,0,0,1,4.8-4.57,8.66,8.66,0,0,1,4.27-1.66,2.8,2.8,0,0,1,2.2.94,5.83,5.83,0,0,1,1.27,2.3,20.38,20.38,0,0,1,.61,2.76A19.1,19.1,0,0,1,86.93,56Q85.06,59,83,62.06Z"></path>
                              <path class="cls-1" d="M161.77,53.41a2.08,2.08,0,0,1,1.89-.93,3,3,0,0,1,1.72.49,1,1,0,0,1,.4,1.41,26.9,26.9,0,0,1-5.8,8.38,59,59,0,0,1-7.35,6.08,5.46,5.46,0,0,1,.41,1.86l0,1.61q.09,6.44-3.2,10.21t-11.29,3.88a11.31,11.31,0,0,1-2.39-.29,9.78,9.78,0,0,1-2.78-1.06,8.3,8.3,0,0,1-2.31-1.9,4.5,4.5,0,0,1-1-2.95,5.15,5.15,0,0,1,2.61-4.48,46.16,46.16,0,0,1,6.81-3.63,76,76,0,0,0-4.13-9.54q-2.74-5.44-5.29-10.82c-.37.61-.72,1.17-1,1.69s-.59,1-.84,1.43a2.08,2.08,0,0,1-1.89.93,3.31,3.31,0,0,1-1.91-.49q-.77-.5-.21-1.41t1.12-1.95c.37-.6.77-1.3,1.21-2.07s.9-1.64,1.39-2.59a39.69,39.69,0,0,1-1.87-4.81,13.75,13.75,0,0,1-.72-3.79,5,5,0,0,1,1.76-4,14.57,14.57,0,0,1,4.35-2.57A24.82,24.82,0,0,1,137,30.67a40.85,40.85,0,0,1,5.23-.45,9.29,9.29,0,0,1,4.39.78,4.6,4.6,0,0,1,2,1.78,2.3,2.3,0,0,1,.21,1.8,1.06,1.06,0,0,1-1,.85q-1.34,0-1.72-.49a7,7,0,0,1-.68-1.09,3.67,3.67,0,0,0-.78-1,3.08,3.08,0,0,0-2-.43,3.33,3.33,0,0,0-2.18.93,3.71,3.71,0,0,0-1,3,15.19,15.19,0,0,0,1.41,5.46q1.37,3.27,3.33,7.17t4,8.06a77.25,77.25,0,0,1,3.44,8,38.62,38.62,0,0,0,5.46-5A33.26,33.26,0,0,0,161.77,53.41Z"></path>
                              <path class="cls-1" d="M138,82.3q1,0,1.6-1.44a13.09,13.09,0,0,0,.6-5,22.92,22.92,0,0,0-3.4,2.3,3,3,0,0,0-1.3,2.27Q135.48,82.33,138,82.3Z"></path>
                              <path class="cls-1" d="M227.87,52.59a2.08,2.08,0,0,1,1.89-.93,3,3,0,0,1,1.72.49,1,1,0,0,1,.4,1.41,199.58,199.58,0,0,1-10.44,17.26q-3,4.55-5.14,7.21T211.89,83a26.42,26.42,0,0,1-4.52,3.73A8.36,8.36,0,0,1,203,88.18a12.61,12.61,0,0,1-10.84-5.66q-4.17-5.74-2.82-18.38a64.66,64.66,0,0,1,1.7-8.07q1.18-4.33,2.27-8.08t1.73-6.27q.63-2.52.06-2.51-1.72-.1-4.63,2.83a46,46,0,0,0-6,7.8,81.46,81.46,0,0,0-5.76,11,69,69,0,0,0-4.12,12.61,18.59,18.59,0,0,0,.12,2.19,8.55,8.55,0,0,0,.3,1.41q.2,1-1,1.56a7.7,7.7,0,0,1-2.95.55,9.28,9.28,0,0,1-3.15-.54,3.47,3.47,0,0,1-2.22-2,42.12,42.12,0,0,1-2.6-9.37,104.74,104.74,0,0,1-1.41-12.6q-.38-6.82-.28-14T162,27.21q.49-6.38,1.28-11.35A37.36,37.36,0,0,1,165,8.56a4.7,4.7,0,0,1,3.5-1.78,38,38,0,0,1,4.66-.38,14.77,14.77,0,0,1,6,1.21q1.82,1,1.65,2.3c0,.26-.08,1-.26,2.26s-.41,2.77-.7,4.58-.62,3.83-1,6.06-.64,4.56-.86,7q-1,8.9-1.7,15.41t-1,11.41a87.9,87.9,0,0,1,4.93-8.75,49.8,49.8,0,0,1,5.81-7.48,27,27,0,0,1,6.79-5.24,16.51,16.51,0,0,1,7.69-2,10.73,10.73,0,0,1,7.56,2.8,8.69,8.69,0,0,1,3.23,6.46,18.2,18.2,0,0,1-.88,5.16q-.91,3.1-2.1,7.17t-2.36,9a93.7,93.7,0,0,0-1.86,10.58q-.33,3.74.54,4.76a2.73,2.73,0,0,0,2.2,1,4.67,4.67,0,0,0,2.65-1.19,23.39,23.39,0,0,0,3.2-3.13q1.69-2,3.47-4.42t3.46-5.07Q223.59,60.24,227.87,52.59Z"></path>
                              <path class="cls-1" d="M261.59,52.17q.18-.9,1.7-.92a3.48,3.48,0,0,1,1.82.49,1,1,0,0,1,.49,1.41,113.86,113.86,0,0,1-7.27,12.32q-2.06,3.25-3.55,5.2a33.75,33.75,0,0,1-3.1,3.52,21.32,21.32,0,0,1-3.2,2.62,5.85,5.85,0,0,1-3.13,1.07,16.8,16.8,0,0,1-8.12-1.7,14,14,0,0,1-5.4-5,22.43,22.43,0,0,1-3-7.56,49.62,49.62,0,0,1-1-9.52,40.86,40.86,0,0,1,.56-8.12,22.41,22.41,0,0,1,1-4q.37-1.16,2.64-1.77a17.84,17.84,0,0,1,4.37-.63,15.56,15.56,0,0,1,5,.65q2.1.68,2.11,1.33a16.76,16.76,0,0,1-.26,2q-.26,1.61-.61,4t-.6,5.29q-.25,2.9-.21,5.86a29.3,29.3,0,0,0,.66,6.43A12.51,12.51,0,0,0,244,68.93a5.2,5.2,0,0,0,1.83,1.84,3.47,3.47,0,0,0,1.53.5q1.72,0,4.06-3t4.77-6.63Q258.8,57.48,261.59,52.17Z"></path>
                              <path class="cls-1" d="M239.43,33.77a10.25,10.25,0,0,1-4.1-.66,7.53,7.53,0,0,1-2.59-1.71,5.94,5.94,0,0,1-1.36-2.17,6.38,6.38,0,0,1-.41-1.93,4,4,0,0,1,1.87-3q1.88-1.5,6.84-1.57t7,1.2a3.77,3.77,0,0,1,2,3.19,4.19,4.19,0,0,1-.55,1.87,8.56,8.56,0,0,1-1.69,2.21A8.87,8.87,0,0,1,243.52,33,11.16,11.16,0,0,1,239.43,33.77Z"></path>
                              <path class="cls-1" d="M289.41,45.64a8.75,8.75,0,0,0-6-2.76q-.39-.51-3.16-.86a49.9,49.9,0,0,0-6.77-.3,9.22,9.22,0,0,0-5.12,1.87,17.92,17.92,0,0,0-4.7,5,30.64,30.64,0,0,0-3.43,7.25,26.94,26.94,0,0,0-1.31,8.9q.06,4.76,1.72,7.32a10.58,10.58,0,0,0,4.15,3.81,13.93,13.93,0,0,0,5.16,1.48q2.67.23,4.77.2a11,11,0,0,0,7.2-2.79,25.54,25.54,0,0,0,5.44-6.57,35.11,35.11,0,0,0,3.42-7.9,23.84,23.84,0,0,0,1.15-6.65Q291.83,48.18,289.41,45.64Zm-4.09,15.25A43.54,43.54,0,0,1,282,67.49a42.91,42.91,0,0,1-3.46,4.87q-1.6,1.89-2,1.89-.76,0-1.65-2.23a20.12,20.12,0,0,1-.95-6.75,22,22,0,0,1,.69-5.61A44.32,44.32,0,0,1,276.47,54a35.46,35.46,0,0,1,2.5-5.12,30.08,30.08,0,0,1,2.71-3.9,6.26,6.26,0,0,1,3.56,2.34q1.45,1.85,1.51,6.36A18.39,18.39,0,0,1,285.33,60.88Z"></path>
                              <path class="cls-1" d="M351.64,75.76a4.81,4.81,0,0,0,2.65-1.13,25.69,25.69,0,0,0,3.2-2.87,45.48,45.48,0,0,0,3.38-4q1.69-2.21,3.37-4.55,3.74-5.45,7.84-12.46a2.08,2.08,0,0,1,1.89-.93,3,3,0,0,1,1.72.49,1,1,0,0,1,.4,1.41,169.22,169.22,0,0,1-10.08,16,82,82,0,0,1-5.15,6.76,59.41,59.41,0,0,1-4.42,4.56A31.5,31.5,0,0,1,352,82.52a8.14,8.14,0,0,1-4.27,1.41,11.13,11.13,0,0,1-8.82-4.14q-3.68-4.2-3.78-12.19a66,66,0,0,1,.55-8.89q.6-4.9,1.12-9.22t.76-7.29q.25-3-.52-3-1.34,0-3.31,2a45.49,45.49,0,0,0-4.22,4.95q-2.25,3-4.67,6.69t-4.38,7.2q-2,3.5-3.44,6.42t-2,4.34q-.37,1.29-2.74,2a18.49,18.49,0,0,1-4.85.7,8,8,0,0,1-4.2-.72A10.85,10.85,0,0,1,299.41,67a35.76,35.76,0,0,1-1.63-8.22q-.34-4.25-.29-7.79t0-4.44q0-1,2.74-1.71a20.69,20.69,0,0,1,4.47-.7q1.52,0,3.43.15A8.33,8.33,0,0,1,312,45.74q1,.63,1.29,3.59t.37,6.18q.05,3.86-.08,8.63a120.69,120.69,0,0,1,8.19-14.65,54.63,54.63,0,0,1,4.4-6,42.23,42.23,0,0,1,4.14-4.17,23.81,23.81,0,0,1,4.53-3.15,10.51,10.51,0,0,1,4.84-1.28,18.28,18.28,0,0,1,8.41,1.83,6.38,6.38,0,0,1,3.89,6q0,1.29-.23,4.32t-.48,6.7q-.24,3.67-.47,7.6t-.29,7.15a44.41,44.41,0,0,0,.17,5.28Q350.88,75.77,351.64,75.76Z"></path>
                              <path class="cls-1" d="M40.9,1.18q7.94,0,11.71,3.42t3.77,10.94q0,1.37-1.79,2.31a7.28,7.28,0,0,1-3.38.94c-1.46,0-2.18-.46-2.18-1.37a28.1,28.1,0,0,0-.79-6.67q-.8-3.25-3.57-3.25-1.19,0-3,1.71a18.56,18.56,0,0,0-3.57,5.64,74.43,74.43,0,0,0-3.57,10.26,110.35,110.35,0,0,0-3,15.56q3.77-.17,7.64-.43t7.84-.77h.4a2,2,0,0,1,1.69.68,2,2,0,0,1,.4,1.45,2.51,2.51,0,0,1-.79,1.45,3.25,3.25,0,0,1-1.89.86q-4,.34-7.94.77T31,45.47a287.08,287.08,0,0,0-1.79,35.22q0,7.35.6,14.88t1.29,13.76q.69,6.24,1.29,10.26t.6,4.53c.13,1-.43,1.82-1.69,2.39a10.78,10.78,0,0,1-4.47.86,13.42,13.42,0,0,1-5.36-1.11,4.55,4.55,0,0,1-3-3.51q-1.39-7.69-2.38-13.59T14.5,97.62Q13.9,92,13.6,86.08t-.3-13.42q0-6.67.2-13.34t.79-13q-2.58.17-4.67.17H3.77a3.34,3.34,0,0,1-2.68-.85,2.21,2.21,0,0,1-.5-1.88,3.53,3.53,0,0,1,1.09-1.88A2.92,2.92,0,0,1,3.77,41c.66,0,2,0,4,.09s4.37.08,7.15.08A145.7,145.7,0,0,1,18,25.46,48.84,48.84,0,0,1,23,12.72a26.73,26.73,0,0,1,7.54-8.46A17.46,17.46,0,0,1,40.9,1.18Z"></path>
                            </clipPath>
                            <clipPath id="slogan">
                             <path class="cls-3" d="M61.38,122.21V103.64H57.55v-2.38h3.83V100q0-9.28,7.74-9.28a12.17,12.17,0,0,1,1.8.13,7.77,7.77,0,0,1,1.58.4l-.31,2.38a6.2,6.2,0,0,0-1.32-.33,10.29,10.29,0,0,0-1.5-.11,4.48,4.48,0,0,0-3.89,1.62,8.84,8.84,0,0,0-1.17,5.11v1.37h6.38v2.38H64.33v18.57Z" ></path>
                              <path class="cls-3" d="M92.44,111.74a13.42,13.42,0,0,1-.64,4.14,10.2,10.2,0,0,1-1.89,3.47,9.29,9.29,0,0,1-3.1,2.4,10.34,10.34,0,0,1-8.45,0,9.29,9.29,0,0,1-3.1-2.4,10.2,10.2,0,0,1-1.89-3.47,13.39,13.39,0,0,1-.64-4.14,13.6,13.6,0,0,1,.64-4.16,10.19,10.19,0,0,1,1.89-3.5,9.33,9.33,0,0,1,3.1-2.4,10.35,10.35,0,0,1,8.45,0,9.33,9.33,0,0,1,3.1,2.4,10.19,10.19,0,0,1,1.89,3.5A13.63,13.63,0,0,1,92.44,111.74Zm-2.95,0a12.47,12.47,0,0,0-.44-3.34,8.1,8.1,0,0,0-1.3-2.73,6.49,6.49,0,0,0-10.34,0,8.1,8.1,0,0,0-1.3,2.73,12.43,12.43,0,0,0-.44,3.34,12.1,12.1,0,0,0,.44,3.34,8.41,8.41,0,0,0,1.3,2.71,6,6,0,0,0,2.16,1.83,7.21,7.21,0,0,0,6,0,6.06,6.06,0,0,0,2.16-1.83,8.41,8.41,0,0,0,1.3-2.71A12.14,12.14,0,0,0,89.5,111.74Z" ></path>
                              <path class="cls-3" d="M109.12,103.64h-.84a9.09,9.09,0,0,0-4.36,1,7.44,7.44,0,0,0-3,3.12v14.43H97.94v-21l2.77,0v4.18a7,7,0,0,1,2.64-3.17,7.67,7.67,0,0,1,4.31-1.19,4.1,4.1,0,0,1,1.45.22Z" ></path>
                              <path class="cls-3" d="M142.38,118.51l4.8-17.29h2.95l-6.34,21H141l-6-18.3-6,18.3h-2.77l-6.34-21h2.95l4.8,17.29,5.72-17.29h3.34Z" ></path>
                              <path class="cls-3" d="M162.36,100.78a8.39,8.39,0,0,1,3.54.68,6.77,6.77,0,0,1,2.44,1.87,7.53,7.53,0,0,1,1.41,2.77,12.62,12.62,0,0,1,.44,3.39,16.71,16.71,0,0,1-.26,2.9H156.11a8.67,8.67,0,0,0,1.85,5.86,6.9,6.9,0,0,0,5.41,2,14.09,14.09,0,0,0,3.26-.37,13.77,13.77,0,0,0,2.86-1l.48,2.22a14.87,14.87,0,0,1-3.19,1.1,16.35,16.35,0,0,1-3.72.43,10.66,10.66,0,0,1-4.38-.84,8.45,8.45,0,0,1-3.1-2.31,9.87,9.87,0,0,1-1.85-3.47,14.51,14.51,0,0,1-.62-4.29,14.34,14.34,0,0,1,.64-4.38,10.61,10.61,0,0,1,1.83-3.48,8.2,8.2,0,0,1,2.9-2.29A8.94,8.94,0,0,1,162.36,100.78Zm-.13,2.24a5.29,5.29,0,0,0-2.57.61,6,6,0,0,0-1.89,1.6,7.41,7.41,0,0,0-1.19,2.23,9,9,0,0,0-.46,2.56h11.26a7.8,7.8,0,0,0-1-5A4.54,4.54,0,0,0,162.23,103Z" ></path>
                              <path class="cls-3" d="M175.69,91.14h2.95v12.1a7.66,7.66,0,0,1,2.53-1.72,8.9,8.9,0,0,1,3.72-.75,7.91,7.91,0,0,1,6.4,3.06,10.21,10.21,0,0,1,1.72,3.41,14.77,14.77,0,0,1,.59,4.27,13.63,13.63,0,0,1-.7,4.47,9.46,9.46,0,0,1-5.48,5.83,11.86,11.86,0,0,1-4.6.84,18.29,18.29,0,0,1-7.13-1.36Zm8.54,12a7.23,7.23,0,0,0-3.12.69,9.81,9.81,0,0,0-2.46,1.61v14.15a11.17,11.17,0,0,0,4.18.66,7.23,7.23,0,0,0,5.85-2.34,9.49,9.49,0,0,0,2-6.33,13.88,13.88,0,0,0-.37-3.29,8.07,8.07,0,0,0-1.17-2.68,5.78,5.78,0,0,0-2-1.81A5.91,5.91,0,0,0,184.23,103.16Z" ></path>
                              <path class="cls-3" d="M233.33,106.63a44.57,44.57,0,0,1-2.31,4.93,26.88,26.88,0,0,1-2.57,4q1.85,1.28,3.85,2.53l4,2.53L235,122.74q-2-1.23-4.07-2.57t-4-2.71a18,18,0,0,1-4.73,3.83,12.1,12.1,0,0,1-6,1.45,11.36,11.36,0,0,1-3.5-.51,8,8,0,0,1-2.66-1.41,6.18,6.18,0,0,1-1.69-2.16,6.43,6.43,0,0,1-.59-2.79,6.24,6.24,0,0,1,.59-2.71,9.91,9.91,0,0,1,1.5-2.29,14.06,14.06,0,0,1,2-1.87q1.08-.83,2.09-1.5a15.85,15.85,0,0,1-3.28-3.76,8.38,8.38,0,0,1-1.3-4.51,6.93,6.93,0,0,1,.55-2.77,6.25,6.25,0,0,1,1.54-2.18,7,7,0,0,1,2.42-1.41,9.38,9.38,0,0,1,3.15-.51,8.8,8.8,0,0,1,2.84.44A6.65,6.65,0,0,1,222.07,94a5.82,5.82,0,0,1,1.45,1.87,5.29,5.29,0,0,1,.53,2.35,6.88,6.88,0,0,1-.68,3,12.09,12.09,0,0,1-1.67,2.57,14.89,14.89,0,0,1-2.13,2.07q-1.14.9-2,1.52,2.11,1.8,4.25,3.41t4.69,3.28a27.79,27.79,0,0,0,2.38-3.72q1.1-2,2.33-4.86Zm-17.12,13.82a9.86,9.86,0,0,0,4.82-1.14A14.57,14.57,0,0,0,225,116q-1.19-.79-2.44-1.67t-2.46-1.8q-1.21-.92-2.35-1.83T215.64,109q-.83.62-1.74,1.32a11.6,11.6,0,0,0-1.63,1.54,8.19,8.19,0,0,0-1.19,1.78,4.71,4.71,0,0,0-.46,2.09,4.13,4.13,0,0,0,1.56,3.54A6.55,6.55,0,0,0,216.21,120.45ZM212,99.29a6.61,6.61,0,0,0,1.08,3.74,14.87,14.87,0,0,0,2.71,3q1-.7,2-1.52a13.44,13.44,0,0,0,1.78-1.76,9.58,9.58,0,0,0,1.3-2,5.23,5.23,0,0,0,.51-2.29,3.54,3.54,0,0,0-1.3-2.9,5,5,0,0,0-3.23-1.06,4.9,4.9,0,0,0-3.52,1.25A4.59,4.59,0,0,0,212,99.29Z" ></path>
                              <path class="cls-3" d="M250.18,101.22H253v2.9a10.84,10.84,0,0,1,2.82-2.35,8,8,0,0,1,4.14-1,7.36,7.36,0,0,1,3.56.84,7.54,7.54,0,0,1,2.57,2.29,10.23,10.23,0,0,1,1.54,3.41,17,17,0,0,1,.51,4.25,13.31,13.31,0,0,1-.75,4.6,9.92,9.92,0,0,1-2.13,3.5,9.22,9.22,0,0,1-3.34,2.22,11.91,11.91,0,0,1-4.38.77,16.11,16.11,0,0,1-2.33-.15,14.75,14.75,0,0,1-2-.46v9.23h-2.95Zm9,1.94a6,6,0,0,0-3.5,1.08,13.2,13.2,0,0,0-2.57,2.28v13.09a8.37,8.37,0,0,0,1.91.51,14.66,14.66,0,0,0,2.18.16,7.51,7.51,0,0,0,5.9-2.26,9.36,9.36,0,0,0,2-6.46,15.38,15.38,0,0,0-.35-3.41,8.05,8.05,0,0,0-1.08-2.65,5.18,5.18,0,0,0-1.85-1.72A5.44,5.44,0,0,0,259.2,103.16Z" ></path>
                              <path class="cls-3" d="M285.56,119.35a11.69,11.69,0,0,1-1.21,1.12,9.67,9.67,0,0,1-1.65,1.08,10.25,10.25,0,0,1-2,.79,8.87,8.87,0,0,1-2.35.31,5.8,5.8,0,0,1-5.3-8.27,5.12,5.12,0,0,1,1.52-1.83,7.22,7.22,0,0,1,2.31-1.12,12.85,12.85,0,0,1,2.93-.48q1.41-.09,2.86-.13l2.9-.09v-1.36a6.92,6.92,0,0,0-1.3-4.64,5.1,5.1,0,0,0-4-1.47,11.52,11.52,0,0,0-2.93.35,9.55,9.55,0,0,0-2.62,1.14l-.75-2.24a12.06,12.06,0,0,1,2.9-1.23,13.62,13.62,0,0,1,3.78-.48,9.58,9.58,0,0,1,3.17.51,6.35,6.35,0,0,1,2.49,1.56,7.44,7.44,0,0,1,1.63,2.64,10.63,10.63,0,0,1,.59,3.74v13h-2.9Zm-6.57,1a7.19,7.19,0,0,0,3.59-1,11.12,11.12,0,0,0,2.94-2.38v-4.18q-1.45,0-2.83.13l-2.56.18a7.73,7.73,0,0,0-3.4,1.08,3,3,0,0,0-1.34,2.75Q275.39,120.36,279,120.36Z" ></path>
                              <path class="cls-3" d="M295.19,101.22H298v2.9a10.84,10.84,0,0,1,2.82-2.35,8,8,0,0,1,4.14-1,7.36,7.36,0,0,1,3.56.84,7.54,7.54,0,0,1,2.57,2.29,10.23,10.23,0,0,1,1.54,3.41,17,17,0,0,1,.51,4.25,13.31,13.31,0,0,1-.75,4.6,9.92,9.92,0,0,1-2.13,3.5,9.22,9.22,0,0,1-3.34,2.22,11.91,11.91,0,0,1-4.38.77,16.11,16.11,0,0,1-2.33-.15,14.75,14.75,0,0,1-2-.46v9.23h-2.95Zm9,1.94a6,6,0,0,0-3.5,1.08,13.2,13.2,0,0,0-2.57,2.28v13.09a8.37,8.37,0,0,0,1.91.51,14.66,14.66,0,0,0,2.18.16,7.51,7.51,0,0,0,5.9-2.26,9.36,9.36,0,0,0,2-6.46,15.38,15.38,0,0,0-.35-3.41,8.05,8.05,0,0,0-1.08-2.65,5.18,5.18,0,0,0-1.85-1.72A5.44,5.44,0,0,0,304.21,103.16Z" ></path>
                              <path class="cls-3" d="M326.3,100.78a8.39,8.39,0,0,1,3.54.68,6.77,6.77,0,0,1,2.44,1.87,7.53,7.53,0,0,1,1.41,2.77,12.62,12.62,0,0,1,.44,3.39,16.71,16.71,0,0,1-.26,2.9H320.05a8.67,8.67,0,0,0,1.85,5.86,6.9,6.9,0,0,0,5.41,2,14.09,14.09,0,0,0,3.26-.37,13.77,13.77,0,0,0,2.86-1l.48,2.22a14.87,14.87,0,0,1-3.19,1.1,16.35,16.35,0,0,1-3.72.43,10.66,10.66,0,0,1-4.38-.84,8.45,8.45,0,0,1-3.1-2.31,9.87,9.87,0,0,1-1.85-3.47,14.51,14.51,0,0,1-.62-4.29,14.34,14.34,0,0,1,.64-4.38,10.61,10.61,0,0,1,1.83-3.48,8.2,8.2,0,0,1,2.9-2.29A8.94,8.94,0,0,1,326.3,100.78Zm-.13,2.24a5.29,5.29,0,0,0-2.57.61,6,6,0,0,0-1.89,1.6,7.41,7.41,0,0,0-1.19,2.23,9,9,0,0,0-.46,2.56h11.26a7.8,7.8,0,0,0-1-5A4.54,4.54,0,0,0,326.17,103Z" ></path>
                              <path class="cls-3" d="M350.81,103.64H350a9.09,9.09,0,0,0-4.36,1,7.44,7.44,0,0,0-3,3.12v14.43h-2.95v-21l2.77,0v4.18a7,7,0,0,1,2.64-3.17,7.67,7.67,0,0,1,4.31-1.19,4.1,4.1,0,0,1,1.45.22Z" ></path>
                          </clipPath>
                          </defs>
                          <g clip-path="url(#mask_1_)">
                          
                            <path class="fashion-path" d="M29.07,123.05"></path>
                            <path class="fashion-path" d="M23.5,43.5"></path>
                            <path class="fashion-path" d="M23.5,43.5"></path>
                            <path class="fashion-path" d="M4,44"></path>
                            <path class="fashion-path" d="M55,17.45l-.07-.74c-.26-2.68-.55-5.71-2.21-8-3-4.23-10.74-4-14.41-3.3C33,6.38,29.25,9.73,26,16.23,23.63,21,22,26.65,20.74,34.07c-.49,3-.87,6.12-1.16,9.43,0,0-3.07,56.24,4.92,79.12"></path>
                            <path class="fashion-path" d="M53.5,43.5H3.5V47"></path>
                            <path class="fashion-path" d="M106.5,47.5s-49-4-46,20,39-10,39-10-10,47,31-5"></path>
                            <path class="fashion-path" d="M147.69,29.45s-19,6.58-17.37,13.39S148.26,60.4,150.38,71C154,89,127,83,127,83"></path>
                            <path class="fashion-path" d="M158,68s11.82-29.72,14.41-62.86L171,83s18.5-63.5,38.5-41.5c0,0-8,5-13,28-6.59,30.29,36-12,44-29,0,0-18,52,24,24"></path>
                            <path class="fashion-path" d="M275,43s-27,22,5,35c0,0,17.5-24.5-4.5-40.5"></path>
                            <path class="fashion-path" d="M303.5,41.5l6,31S322,37,347,42c0,0-11,37,3,38s17.5-22.5,21-33"></path>
                            <path class="fashion-path" d="M249,32l-17.5-.5V35"></path>
                          </g>
                          <g clip-path="url(#slogan)">
                          
                            <line class="slogan-line" x1="43" y1="103.91" x2="371.5" y2="103.91"/>
                          </g>

                          </svg>
	
	<button class="reverse">Reverse</button>
	<button class="play">Play</button>
	
</div>
              
            
!

CSS

              
                body {
	background-color:rgba(13,13,36,1);


#wrapper {
	
	margin:100px 0 0 50px;
	
		#fashion_svg {
              width:40%;

              /* fashion mask */
              .fashion-path {
                fill:none;
                stroke:transparent;
                stroke-width: 23;
              }

              .slogan-line {
                fill:none;
                stroke:transparent;
                stroke-width: 55;
              }
            }
	
	.reverse, .play {
		display:block;
	}
} 

}		
              
            
!

JS

              
                var paths = $("path.fashion-path");
var line = $('.slogan-line');
var yellow = '#f9dd78';

//setup init animation
var tl = new TimelineMax({paused:true});
  tl.staggerFromTo(paths, .2, {drawSVG:"0% 0%"},  {drawSVG:"0% 100%", stroke:yellow}, .05)
  tl.fromTo(line, .5, {drawSVG:"0% 0%"}, {drawSVG:"0% 100%", stroke:yellow})

tl.play();


//setup click handlers for testing
$('.reverse').on('click', function(){
	tl.reverse();
})

$('.play').on('click', function(){
	tl.play();
})




              
            
!
999px

Console