css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv

Pen Settings

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

You're using npm packages, so we've auto-selected Babel for you here, which we require to process imports and make it all work. If you need to use a different JavaScript preprocessor, remove the packages in the npm tab.

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

Use npm Packages

We can make npm packages available for you to use in your JavaScript. We use webpack to prepare them and make them available to import. We'll also process your JavaScript with Babel.

⚠️ This feature can only be used by logged in users.

Code Indentation

     

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.

HTML Settings

Here you can Sed posuere consectetur est at lobortis. Donec ullamcorper nulla non metus auctor fringilla. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

            
              <div class="wrapper">
  <svg viewBox="0 0 200 200" style="background-color:#ffffff00" xmlns="http://www.w3.org/2000/svg" width="200" height="200">
  <g stroke="#fff" stroke-width="2" fill="none">
    <div class="wrapper">
  <svg viewBox="0 0 200 200" style="background-color:#ffffff00" xmlns="http://www.w3.org/2000/svg" width="200" height="200">
  <g stroke="#fff" stroke-width="2" fill="none">
    <path d="M104.588,94.515c-1.989,0.744-3.82,1.693-5.418,2.67c-0.261-1.854-0.691-3.872-1.379-5.882
	c-0.659,2.02-1.058,4.043-1.291,5.901c-1.613-0.952-3.458-1.874-5.458-2.588c1.168,1.773,2.501,3.347,3.809,4.688
	c-1.75,0.667-3.621,1.534-5.426,2.653c2.115,0.191,4.176,0.132,6.041-0.055c-0.57,1.784-1.058,3.787-1.31,5.896
	c1.469-1.533,2.707-3.183,3.724-4.757c1.039,1.559,2.302,3.188,3.794,4.7c-0.283-2.104-0.802-4.102-1.398-5.876
	c1.867,0.157,3.929,0.188,6.041-0.036c-1.822-1.091-3.705-1.93-5.466-2.571C102.137,97.898,103.445,96.306,104.588,94.515z"/>
<path d="M132.605,33.209c8.906-4.461,26.324-2.811,36.449,1.875c-9.281,13.327-21.426,24.155-43.799,20.657
	c-0.594-1.557-0.616-3.579-0.269-5.898c8.983,1.862,19.513,0.732,24.224-3.68c0.6-0.562,1.146-1.346,1.453-1.982
	c3.709-7.694-8.531-8.273-13.381-6.388C136.006,36.037,134.258,34.663,132.605,33.209"/>
<path d="M67.329,31.175C69.395,21.429,81.545,8.841,91.52,3.847c4.633,15.565,5.526,31.812-11.158,47.122
	c-1.588-0.506-3.181-1.749-4.779-3.467c7.057-5.862,12.739-14.798,12.226-21.233c-0.064-0.819-0.337-1.736-0.643-2.373
	c-3.703-7.698-11.788,1.514-13.338,6.48C71.66,30.28,69.495,30.789,67.329,31.175"/>
<path d="M25.04,80.941c-6.332-7.691-8.599-25.04-6.284-35.953c15.059,6.083,28.317,15.514,29.885,38.104
	c-1.386,0.926-3.352,1.397-5.691,1.574c-0.184-9.172-3.628-19.186-8.978-22.797c-0.681-0.46-1.568-0.819-2.255-0.976
	c-8.328-1.904-6.167,10.16-3.25,14.468C27.039,76.997,26.088,79.007,25.04,80.941"/>
<path d="M37.582,145.035c-9.96,0.154-24.937-8.891-32.026-17.505c14.144-7.979,29.784-12.466,48.424,0.394
	c-0.14,1.659-0.997,3.49-2.317,5.43c-7.286-5.574-17.263-9.126-23.422-7.194c-0.784,0.245-1.617,0.716-2.17,1.155
	c-6.68,5.323,4.098,11.156,9.285,11.562C35.745,141.012,36.723,143.008,37.582,145.035"/>
<path d="M95.511,175.189c-6.089,7.883-22.499,13.953-33.653,14.125c2.58-16.033,8.823-31.059,30.498-37.615
	c1.211,1.146,2.108,2.959,2.802,5.199c-8.901,2.221-17.898,7.807-20.229,13.826c-0.297,0.766-0.45,1.711-0.45,2.416
	c-0.003,8.543,11.277,3.754,14.829-0.051C91.22,174.117,93.391,174.598,95.511,175.189"/>
<path d="M155.205,148.699c2.367,9.678-3.117,26.291-9.938,35.119c-10.927-12.014-18.78-26.264-10.394-47.297
	c1.652-0.232,3.627,0.196,5.812,1.051c-3.813,8.343-5.056,18.861-1.804,24.436c0.415,0.709,1.058,1.418,1.61,1.859
	c6.676,5.328,9.964-6.479,9.206-11.625C151.691,151.387,153.42,149.988,155.205,148.699"/>
<path d="M171.713,85.513c9.043,4.183,18.611,18.829,21.262,29.666c-16.207,1.053-32.244-1.69-43.459-21.363
	c0.848-1.436,2.414-2.713,4.445-3.888c4.145,8.184,11.592,15.712,17.979,16.645c0.814,0.119,1.768,0.059,2.457-0.099
	c8.328-1.897,1.148-11.83-3.35-14.446C171.623,89.934,171.607,87.71,171.713,85.513"/>
<path d="M170.377,79.854c-1.076-1.918-2.057-3.914-3.51-5.528c2.854-4.352,4.832-16.447-3.465-14.418
	c-0.686,0.168-1.568,0.54-2.242,1.01c-5.295,3.691-8.588,13.755-8.635,22.929c-2.342-0.142-4.314-0.584-5.715-1.489
	c1.23-22.61,14.348-32.238,29.312-38.546C178.6,54.689,176.594,72.069,170.377,79.854"/>
<path d="M127.348,30.726c-2.171-0.354-4.343-0.831-6.51-0.702c-1.625-4.943-9.846-14.032-13.434-6.28
	c-0.297,0.642-0.555,1.562-0.608,2.382c-0.416,6.441,5.399,15.292,12.543,21.047c-1.571,1.742-3.146,3.009-4.728,3.539
	C97.7,35.654,98.352,19.396,102.75,3.763C112.8,8.608,125.137,21.013,127.348,30.726"/>
<path d="M62.11,33.737c-1.63,1.478-3.358,2.878-4.608,4.652c-4.877-1.812-17.109-1.051-13.285,6.588
	c0.316,0.631,0.875,1.407,1.483,1.96c4.777,4.341,15.322,5.313,24.276,3.317c0.382,2.315,0.39,4.336-0.18,5.902
	c-22.318,3.833-34.623-6.812-44.103-20C35.746,31.321,53.137,29.41,62.11,33.737"/>
<path d="M23.788,86.62c0.139,2.196,0.157,4.42,0.765,6.503c-4.458,2.684-11.489,12.722-3.133,14.494
	c0.691,0.146,1.646,0.193,2.458,0.062c6.372-1.027,13.707-8.667,17.729-16.912c2.048,1.145,3.634,2.398,4.501,3.821
	C35.189,114.428,19.194,117.41,2.974,116.6C5.461,105.726,14.811,90.937,23.788,86.62"/>
<path d="M41.24,149.553c1.803,1.26,3.553,2.633,5.561,3.457c-0.682,5.158,2.783,16.912,9.378,11.486
	c0.546-0.449,1.177-1.166,1.581-1.883c3.17-5.623,1.771-16.119-2.168-24.406c2.171-0.887,4.141-1.345,5.794-1.136
	c8.703,20.903,1.062,35.271-9.684,47.446C44.751,175.793,39.018,159.264,41.24,149.553"/>
<path d="M101.324,175.146c2.109-0.625,4.273-1.137,6.17-2.193c3.609,3.75,14.959,8.371,14.828-0.172
	c-0.011-0.705-0.178-1.646-0.485-2.408c-2.42-5.984-11.499-11.436-20.434-13.521c0.661-2.252,1.529-4.076,2.725-5.24
	c21.77,6.23,28.237,21.16,31.056,37.154C124.029,188.762,107.531,182.938,101.324,175.146"/>
<path d="M158.797,144.127c0.828-2.038,1.775-4.05,2.133-6.19c5.18-0.483,15.869-6.478,9.111-11.699
	c-0.561-0.431-1.398-0.888-2.188-1.122c-6.188-1.84-16.109,1.86-23.311,7.544c-1.35-1.919-2.233-3.737-2.398-5.396
	c18.445-13.137,34.15-8.885,48.412-1.117C183.598,134.865,168.758,144.134,158.797,144.127"/>
<path d="M127.123,38.009c3.324,2.357,5.895,5.345,6.984,7.989c0.384,0.933,0.541,2.399,0.742,3.102
	c2.264,0.079,4.046-0.437,5.953-0.797c-1.652-6.601-5.503-11.82-11.197-15.549c-6.496-2.03-12.975-1.689-19.123,1.226
	c0.934,1.703,1.668,3.407,3.166,5.105c0.669-0.292,1.902-1.102,2.867-1.397C119.25,36.85,123.19,36.939,127.123,38.009z"/>
<path d="M164.543,84.219c0.23,4.069-0.504,7.942-1.893,10.442c-0.488,0.882-1.537,1.92-1.961,2.514
	c1.35,1.82,2.865,2.891,4.334,4.159c4.131-5.408,5.811-11.673,5.174-18.45c-2.463-6.346-6.768-11.197-12.879-14.186
	c-0.75,1.792-1.625,3.427-2.018,5.658c0.645,0.342,2.047,0.801,2.881,1.37C160.541,77.342,162.928,80.478,164.543,84.219z"/>
<path d="M151.746,142.287c-3.039,2.717-6.523,4.559-9.344,5.031c-0.995,0.168-2.459-0.006-3.188,0.033
	c-0.582,2.189-0.476,4.043-0.549,5.982c6.803-0.143,12.748-2.736,17.65-7.457c3.424-5.883,4.533-12.273,3.061-18.916
	c-1.869,0.531-3.693,0.867-5.682,1.951c0.135,0.719,0.65,2.1,0.723,3.105C154.627,134.869,153.664,138.691,151.746,142.287z"/>
<path d="M98.368,168.486c-4.018-0.682-7.63-2.258-9.76-4.168c-0.751-0.672-1.528-1.926-2.015-2.473
	c-2.074,0.912-3.456,2.148-5.019,3.303c4.354,5.229,10.087,8.26,16.835,9.15c6.734-0.99,12.421-4.107,16.697-9.402
	c-1.58-1.129-2.979-2.346-5.066-3.225c-0.479,0.553-1.237,1.816-1.979,2.502C105.963,166.113,102.375,167.746,98.368,168.486z"/>
<path d="M44.603,143.089c-1.972-3.565-2.991-7.374-2.826-10.229c0.058-1.007,0.553-2.397,0.677-3.116
	c-2.005-1.054-3.835-1.363-5.71-1.865c-1.374,6.663-0.169,13.037,3.343,18.867c4.973,4.648,10.958,7.15,17.76,7.191
	c-0.102-1.938-0.024-3.791-0.637-5.973c-0.73-0.027-2.192,0.168-3.189,0.016C51.193,147.547,47.681,145.759,44.603,143.089z"/>
<path d="M30.938,85.218c1.559-3.765,3.9-6.937,6.235-8.586c0.824-0.582,2.218-1.062,2.859-1.414
	c-0.427-2.225-1.327-3.848-2.102-5.627c-6.066,3.081-10.299,7.997-12.667,14.377c-0.533,6.785,1.241,13.024,5.45,18.37
	c1.452-1.289,2.95-2.383,4.272-4.222c-0.433-0.589-1.497-1.61-2-2.484C31.561,93.152,30.77,89.29,30.938,85.218z"/>
<path d="M67.663,38.453c3.916-1.128,7.855-1.275,10.602-0.479c0.969,0.282,2.213,1.073,2.888,1.354
	c1.473-1.721,2.181-3.436,3.089-5.152c-6.191-2.822-12.672-3.066-19.138-0.939c-5.638,3.814-9.41,9.09-10.964,15.714
	c1.913,0.332,3.703,0.82,5.965,0.708c0.19-0.706,0.326-2.174,0.696-3.113C61.849,43.887,64.375,40.86,67.663,38.453z"/>
<path d="M190.449,120.373c-8.811-4.709-18.002-7.708-28.18-6.211C170.877,119.801,180.475,120.94,190.449,120.373z"
	/>
<path d="M139.633,185.084c-1.813-9.826-5.197-18.881-12.715-25.906C127.877,169.424,132.97,177.639,139.633,185.084z
	"/>
<path d="M57.355,185.699c6.551-7.545,11.521-15.834,12.325-26.092C62.269,166.744,59.021,175.848,57.355,185.699z"/>
<path d="M5.576,121.756c9.982,0.418,19.562-0.865,28.083-6.631C23.459,113.778,14.316,116.916,5.576,121.756z"/>
<path d="M23.285,41.405c5.896,8.065,12.873,14.755,22.695,17.822C40.671,50.414,32.517,45.221,23.285,41.405z"/>
<path d="M97.146,5.152c-2.629,9.639-3.51,19.264,0.215,28.856C100.943,24.362,99.919,14.75,97.146,5.152z"/>
<path d="M171.541,40.295c-9.174,3.954-17.248,9.268-22.426,18.161C158.891,55.242,165.766,48.449,171.541,40.295z"/>
<path d="M144.152,89.034c-2.607,3.447-4.129,7.451-5.007,10.567c1.808-0.065,3.395,0.875,5.238,0.641
	c1.218-6.85,11.325-15.574,18.542-12.053c0.168-1.188,0.279-2.388,0.188-3.632c-0.475-1.153-1.109-2.178-1.793-3.164
	c-4.879,6.377-17.82,3.095-21.975-2.487c-1.755,0.616-2.752,2.167-4.398,2.917C137.127,84.217,140.279,87.116,144.152,89.034z"/>
<path d="M135.268,129.346c-4.32,0.113-8.398,1.418-11.383,2.675c1.178,1.373,1.432,3.2,2.765,4.495
	c6.115-3.318,19.237-0.856,20.985,6.98c1.033-0.607,2.039-1.27,2.957-2.116c0.605-1.091,1.01-2.227,1.355-3.374
	c-8.027,0.161-13.531-12.004-11.757-18.731c-1.575-0.987-3.41-0.802-5.022-1.62C134.653,120.851,134.352,125.123,135.268,129.346z"
	/>
<path d="M98.211,147.535c-2.781-3.309-6.346-5.684-9.188-7.232c-0.339,1.777-1.608,3.114-1.791,4.965
	c6.408,2.713,12.665,14.508,7.627,20.76c1.119,0.428,2.265,0.803,3.499,0.992c1.23-0.207,2.37-0.6,3.483-1.045
	c-5.131-6.176,0.948-18.062,7.316-20.87c-0.211-1.847-1.5-3.166-1.866-4.938C104.471,141.759,100.941,144.186,98.211,147.535z"/>
<path d="M60.886,129.902c0.852-4.236,0.486-8.502-0.075-11.691c-1.601,0.842-3.438,0.684-4.998,1.694
	c1.875,6.701-3.445,18.946-11.475,18.905c0.363,1.143,0.784,2.271,1.406,3.354c0.929,0.832,1.946,1.48,2.988,2.072
	c1.63-7.862,14.713-10.521,20.878-7.293c1.314-1.316,1.54-3.146,2.698-4.537C69.305,131.195,65.208,129.95,60.886,129.902z"/>
<path d="M51.399,89.728c3.844-1.976,6.952-4.922,9.096-7.349c-1.657-0.726-2.678-2.261-4.441-2.851
	c-4.07,5.644-16.961,9.119-21.935,2.816c-0.668,0.996-1.288,2.03-1.746,3.19c-0.072,1.246,0.056,2.444,0.243,3.629
	c7.163-3.628,17.398,4.943,18.719,11.775c1.848,0.207,3.42-0.757,5.229-0.719C55.639,97.116,54.058,93.136,51.399,89.728z"/>
<path d="M76.896,57.262c3.94,1.774,8.182,2.367,11.416,2.53c-0.466-1.748,0.098-3.504-0.541-5.25
	c-6.95,0.336-17.705-7.575-15.878-15.395c-1.195,0.099-2.39,0.26-3.583,0.625c-1.019,0.721-1.876,1.568-2.686,2.453
	c7.303,3.338,6.983,16.685,2.465,21.978c0.991,1.573,2.724,2.201,3.822,3.639C73.762,65.183,75.888,61.465,76.896,57.262z"/>
<path d="M118.174,56.954c1.07,4.187,3.251,7.873,5.141,10.502c1.076-1.454,2.801-2.108,3.768-3.696
	c-4.597-5.223-5.116-18.565,2.136-22.011c-0.823-0.872-1.692-1.707-2.722-2.412c-1.197-0.347-2.395-0.489-3.592-0.571
	c1.945,7.791-8.691,15.863-15.646,15.63c-0.611,1.756-0.021,3.503-0.46,5.257C110.027,59.442,114.26,58.786,118.174,56.954z"/>
<path d="M127.99,72.038c4.721-3.712,8.83-8.179,11.48-14.448c-1.972,0.282-4.074,0.403-6.268,0.409
	c-1.139,2.628-3.964,5.522-6.344,7.872c-0.433,0.428-2.353,2.071-2.37,2.242c-0.052,0.522,1.418,1.6,1.751,1.963
	C126.96,70.862,127.38,71.44,127.99,72.038"/>
<path d="M94.81,58.992c0.041-6.005-0.89-12.002-4.138-17.983c-1.009,1.717-2.224,3.436-3.589,5.156
	c1.346,2.527,1.846,6.541,2.2,9.866c0.065,0.605,0.152,3.131,0.274,3.251c0.375,0.366,2.135-0.111,2.626-0.145
	C93.247,59.065,93.961,59.097,94.81,58.992"/>
<path d="M63.921,76.8c-4.669-3.776-9.939-6.788-16.64-7.978c0.713,1.86,1.3,3.882,1.794,6.021
	c2.814,0.524,6.264,2.635,9.085,4.432c0.514,0.326,2.542,1.833,2.713,1.812c0.52-0.066,1.244-1.739,1.524-2.144
	C63.004,78.068,63.475,77.529,63.921,76.8"/>
<path d="M58.586,112.053c-5.864,1.297-11.504,3.537-16.612,8.035c1.899,0.604,3.846,1.404,5.826,2.354
	c2.165-1.875,5.966-3.257,9.13-4.342c0.575-0.198,3.018-0.844,3.109-0.992c0.273-0.446-0.584-2.057-0.726-2.526
	C59.005,113.56,58.877,112.857,58.586,112.053"/>
<path d="M82.821,138.203c-2.643,5.393-4.407,11.199-4.075,17.998c1.654-1.107,3.495-2.131,5.471-3.088
	c-0.116-2.861,1.174-6.693,2.298-9.844c0.204-0.574,1.221-2.887,1.164-3.049c-0.179-0.492-1.972-0.824-2.429-1.008
	C84.261,138.815,83.631,138.478,82.821,138.203"/>
<path d="M118.377,135.562c2.568,5.429,6.009,10.428,11.531,14.407c0.164-1.986,0.512-4.062,0.996-6.203
	c-2.309-1.693-4.5-5.092-6.264-7.934c-0.32-0.518-1.494-2.756-1.657-2.811c-0.497-0.168-1.875,1.026-2.304,1.27
	C119.754,134.817,119.096,135.098,118.377,135.562"/>
<path d="M138.479,106.115c5.845,1.376,11.899,1.804,18.452-0.033c-1.449-1.366-2.855-2.934-4.229-4.646
	c-2.764,0.75-6.786,0.344-10.108-0.051c-0.604-0.07-3.085-0.547-3.229-0.456c-0.441,0.286-0.367,2.107-0.443,2.593
	C138.756,104.575,138.565,105.264,138.479,106.115"/>
<path d="M131.438,76.295c0.459,0.723,0.938,1.254,1.557,2.12c0.285,0.401,1.033,2.063,1.555,2.121
	c0.172,0.018,2.178-1.519,2.686-1.853c2.793-1.839,6.211-4.001,9.02-4.567c0.461-2.146,1.018-4.177,1.703-6.047
	C141.274,69.359,136.051,72.449,131.438,76.295"/>
<path d="M100.287,58.951c0.85,0.092,1.564,0.049,2.627,0.105c0.492,0.027,2.26,0.478,2.629,0.106
	c0.121-0.122,0.17-2.648,0.226-3.255c0.304-3.33,0.745-7.351,2.052-9.898c-1.389-1.699-2.631-3.399-3.664-5.102
	C100.997,46.937,100.156,52.947,100.287,58.951"/>
<path d="M67.304,72.492c0.602-0.607,1.014-1.192,1.721-1.988c0.327-0.368,1.781-1.468,1.721-1.989
	c-0.021-0.171-1.965-1.785-2.404-2.206c-2.415-2.313-5.284-5.165-6.459-7.776c-2.195,0.027-4.298-0.063-6.274-0.315
	C58.353,64.447,62.529,68.852,67.304,72.492"/>
<path d="M57.327,106.723c-0.1-0.85-0.3-1.537-0.481-2.586c-0.084-0.485-0.038-2.308-0.481-2.586
	c-0.147-0.09-2.621,0.424-3.224,0.504c-3.314,0.446-7.332,0.91-10.106,0.203c-1.348,1.732-2.729,3.321-4.159,4.709
	C45.456,108.703,51.503,108.186,57.327,106.723"/>
<path d="M77.868,135.863c-0.727-0.451-1.388-0.723-2.322-1.234c-0.431-0.236-1.828-1.41-2.322-1.237
	c-0.162,0.059-1.303,2.313-1.616,2.835c-1.719,2.869-3.86,6.3-6.144,8.027c0.515,2.135,0.896,4.205,1.089,6.188
	C72.016,146.381,75.381,141.33,77.868,135.863"/>
<path d="M113.461,137.975c-0.807,0.285-1.432,0.634-2.414,1.045c-0.455,0.189-2.243,0.55-2.414,1.045
	c-0.056,0.162,0.996,2.461,1.209,3.03c1.17,3.132,2.518,6.946,2.445,9.808c1.988,0.928,3.844,1.924,5.516,3.008
	C118.033,149.107,116.182,143.326,113.461,137.975"/>
<path d="M137.3,111.463c-0.278,0.809-0.396,1.514-0.687,2.539c-0.137,0.474-0.97,2.096-0.689,2.539
	c0.092,0.145,2.545,0.755,3.124,0.944c3.179,1.036,7.001,2.36,9.192,4.202c1.967-0.977,3.9-1.809,5.791-2.438
	C148.855,114.83,143.182,112.672,137.3,111.463"/>
<path d="M152.654,112.043c-3.066-2.065-6.395-3.354-9.206-4.064c0.024,0.684-0.096,1.336-0.24,1.982
	c-0.14,0.647-0.306,1.29-0.614,1.9C145.441,112.398,149.004,112.629,152.654,112.043z"/>
<path d="M122.58,150.34c-0.297-3.686-1.365-7.091-2.562-9.731c-0.52,0.445-1.104,0.757-1.699,1.048
	c-0.594,0.295-1.199,0.564-1.869,0.704C117.806,144.922,119.846,147.85,122.58,150.34z"/>
<path d="M73.887,150.703c2.697-2.529,4.692-5.487,6.011-8.069c-0.672-0.128-1.281-0.391-1.879-0.675
	c-0.601-0.282-1.189-0.587-1.716-1.023C75.146,143.594,74.128,147.014,73.887,150.703z"/>
<path d="M43.242,112.861c3.659,0.531,7.217,0.247,10.058-0.332c-0.318-0.606-0.493-1.245-0.643-1.891
	c-0.155-0.645-0.285-1.295-0.271-1.979C49.586,109.412,46.278,110.75,43.242,112.861z"/>
<path d="M53.723,65.309c1.867,3.192,4.306,5.796,6.53,7.656c0.275-0.627,0.666-1.162,1.077-1.682
	c0.408-0.523,0.834-1.03,1.378-1.445C60.375,68.118,57.267,66.365,53.723,65.309z"/>
<path d="M97.436,43.854c-1.332,3.449-1.847,6.981-1.914,9.878c0.662-0.175,1.324-0.204,1.987-0.206
	c0.662-0.008,1.324,0.011,1.989,0.176C99.386,50.806,98.819,47.282,97.436,43.854z"/>
<path d="M141.464,64.652c-3.526,1.109-6.609,2.908-8.917,4.663c0.549,0.407,0.984,0.907,1.4,1.424
	c0.419,0.513,0.817,1.043,1.103,1.666C137.244,70.512,139.646,67.872,141.464,64.652z"/>
<path d="M113.187,67.511c2.237,1.396,4.886,3.367,6.878,5.474c0.466,0.493,1.649,2.49,2.047,2.527
	c0.534,0.049,1.64-1.454,1.963-1.75c0.826-0.759,1.361-1.142,1.963-1.75c-2.884-3.662-6.211-6.964-10.492-9.493
	c-4.674-1.7-9.336-2.173-13.996-2.075c-0.088,0.851-0.043,1.508-0.105,2.628c-0.023,0.438-0.482,2.247-0.105,2.628
	c0.281,0.284,2.575-0.071,3.252-0.024C107.484,65.876,110.686,66.669,113.187,67.511z"/>
<path d="M132.789,91.718c0.303,2.621,0.414,5.918,0.008,8.791c-0.095,0.671-0.918,2.842-0.699,3.175
	c0.294,0.449,2.158,0.376,2.592,0.444c1.107,0.172,1.742,0.353,2.594,0.442c1.064-4.537,1.57-9.197,0.88-14.121
	c-1.585-4.713-4.122-8.654-7.104-12.236c-0.721,0.462-1.205,0.906-2.12,1.556c-0.357,0.255-2.058,1.023-2.12,1.556
	c-0.046,0.396,1.661,1.969,2.046,2.528C130.512,86.239,131.889,89.238,132.789,91.718z"/>
<path d="M126.085,122.136c-1.86,1.87-4.37,4.013-6.868,5.487c-0.584,0.344-2.795,1.053-2.918,1.433
	c-0.168,0.509,1.051,1.923,1.27,2.304c0.557,0.974,0.811,1.58,1.27,2.303c4.212-1.996,8.172-4.506,11.59-8.116
	c2.697-4.179,4.196-8.618,5.138-13.185c-0.81-0.275-1.461-0.377-2.539-0.688c-0.421-0.12-2.083-0.969-2.538-0.688
	c-0.339,0.211-0.504,2.526-0.699,3.178C128.947,116.939,127.462,119.885,126.085,122.136z"/>
<path d="M98.124,135.859c-2.623-0.287-5.863-0.914-8.572-1.948c-0.634-0.242-2.566-1.528-2.94-1.389
	c-0.503,0.188-0.847,2.021-1.01,2.429c-0.415,1.043-0.731,1.62-1.009,2.429c4.187,2.049,8.618,3.579,13.572,4.001
	c4.947-0.496,9.355-2.094,13.511-4.203c-0.291-0.806-0.616-1.379-1.046-2.414c-0.169-0.405-0.54-2.234-1.046-2.414
	c-0.375-0.134-2.287,1.182-2.918,1.434C103.971,134.857,100.742,135.533,98.124,135.859z"/>
<path d="M69.96,122.555c-1.411-2.229-2.941-5.152-3.822-7.916c-0.206-0.646-0.406-2.961-0.748-3.165
	c-0.46-0.276-2.108,0.599-2.527,0.726c-1.074,0.325-1.722,0.439-2.529,0.725c1.01,4.551,2.575,8.969,5.334,13.105
	c3.473,3.561,7.469,6.01,11.71,7.942c0.449-0.729,0.693-1.34,1.236-2.322c0.211-0.384,1.409-1.815,1.235-2.321
	c-0.129-0.377-2.35-1.053-2.94-1.391C74.389,126.503,71.847,124.398,69.96,122.555z"/>
<path d="M62.802,92.24c0.863-2.493,2.195-5.512,3.807-7.923c0.377-0.564,2.061-2.162,2.009-2.558
	c-0.071-0.532-1.782-1.275-2.143-1.524c-0.925-0.635-1.417-1.072-2.143-1.524c-2.929,3.626-5.407,7.604-6.921,12.341
	c-0.617,4.934-0.041,9.586,1.092,14.107c0.849-0.104,1.479-0.294,2.586-0.482c0.432-0.073,2.297-0.029,2.585-0.481
	c0.214-0.338-0.642-2.495-0.748-3.164C62.476,98.164,62.538,94.866,62.802,92.24z"/>
<path d="M82.04,67.744c2.487-0.879,5.678-1.721,8.568-1.964c0.677-0.057,2.976,0.264,3.252-0.024
	c0.372-0.387-0.114-2.188-0.144-2.626c-0.08-1.119-0.044-1.776-0.146-2.625c-4.661-0.029-9.316,0.514-13.964,2.284
	c-4.242,2.593-7.52,5.944-10.349,9.649c0.611,0.6,1.152,0.975,1.989,1.721c0.328,0.292,1.456,1.777,1.989,1.72
	c0.396-0.042,1.549-2.057,2.009-2.558C77.205,71.183,79.823,69.174,82.04,67.744z"/>
<path d="M141.822,109.656c0.091-0.487,0.189-0.973,0.297-1.459c-1.714-0.362-3.461-0.574-5.185-0.885
	c-0.095,0.4-0.187,0.803-0.272,1.207c-0.092,0.401-0.178,0.805-0.26,1.209c1.695,0.442,3.369,0.984,5.076,1.375
	C141.586,110.619,141.699,110.137,141.822,109.656z"/>
<path d="M117.691,140.383c0.439-0.234,0.881-0.459,1.325-0.677c-0.784-1.565-1.707-3.063-2.539-4.606
	c-0.374,0.176-0.745,0.355-1.113,0.54c-0.371,0.179-0.741,0.362-1.108,0.55c0.712,1.603,1.331,3.248,2.092,4.827
	C116.791,140.798,117.24,140.586,117.691,140.383z"/>
<path d="M78.624,140.675c0.456,0.197,0.907,0.401,1.355,0.614c0.735-1.59,1.33-3.245,2.018-4.857
	c-0.37-0.184-0.742-0.361-1.116-0.533c-0.372-0.18-0.746-0.354-1.121-0.523c-0.809,1.555-1.709,3.066-2.47,4.644
	C77.738,140.229,78.183,140.448,78.624,140.675z"/>
<path d="M54.038,110.312c0.13,0.479,0.252,0.96,0.366,1.442c1.702-0.416,3.366-0.982,5.055-1.451
	c-0.088-0.402-0.18-0.805-0.278-1.205c-0.092-0.402-0.189-0.804-0.29-1.203c-1.72,0.338-3.463,0.575-5.171,0.965
	C53.833,109.342,53.94,109.826,54.038,110.312z"/>
<path d="M62.446,72.16c-0.293,0.4-0.593,0.794-0.9,1.185c1.387,1.07,2.868,2.019,4.286,3.047
	c0.26-0.32,0.517-0.643,0.77-0.969c0.256-0.322,0.51-0.648,0.759-0.977c-1.337-1.133-2.608-2.348-3.978-3.441
	C63.078,71.394,62.765,71.779,62.446,72.16z"/>
<path d="M97.518,54.945c-0.496,0.02-0.991,0.031-1.487,0.035c0.028,1.751,0.21,3.501,0.29,5.252
	c0.412,0.004,0.825,0.002,1.237-0.002c0.413,0,0.825-0.006,1.238-0.016c0.053-1.751,0.21-3.504,0.21-5.255
	C98.51,54.962,98.014,54.958,97.518,54.945z"/>
<path d="M132.844,71.632c-0.324-0.375-0.643-0.755-0.954-1.14c-1.353,1.113-2.606,2.347-3.927,3.5
	c0.256,0.325,0.513,0.646,0.775,0.966c0.258,0.322,0.519,0.641,0.783,0.957c1.403-1.05,2.87-2.02,4.24-3.111
	C133.449,72.419,133.144,72.028,132.844,71.632z"/>
<path d="M106.938,80.738c0.87,0.51,1.781,0.976,2.732,1.378c4.723-0.916,8.912-3.348,11.784-5.429
	c-1.37-1.091-2.171-2.643-3.521-3.75c-2.066,1.125-4.676,2.469-7.631,3.155c-0.321-0.151-0.637-0.31-0.945-0.475
	c-0.324-0.134-0.646-0.277-0.969-0.43c-1.348-2.719-1.965-5.587-2.409-7.898c-1.714-0.34-3.42,0.028-5.133-0.337
	c0.218,3.54,0.999,8.32,3.292,12.55C105.053,79.982,105.992,80.39,106.938,80.738z"/>
<path d="M118.551,95.079c0.145,0.998,0.348,2.001,0.625,2.996c3.662,3.121,8.175,4.88,11.592,5.829
	c-0.001-1.752,0.714-3.344,0.738-5.09c-2.17-0.915-4.846-2.117-7.225-4c-0.084-0.346-0.156-0.692-0.221-1.036
	c-0.096-0.336-0.186-0.678-0.267-1.024c1.286-2.749,3.144-5.021,4.673-6.809c-0.803-1.551-2.154-2.656-2.936-4.222
	c-2.633,2.377-5.883,5.968-7.761,10.397C117.967,93.134,118.233,94.123,118.551,95.079z"/>
<path d="M114.58,113.1c-0.691,0.734-1.348,1.52-1.952,2.357c-0.157,4.808,1.281,9.432,2.67,12.695
	c1.368-1.092,3.06-1.526,4.438-2.596c-0.635-2.266-1.365-5.108-1.377-8.143c0.219-0.281,0.443-0.553,0.672-0.818
	c0.204-0.285,0.415-0.568,0.635-0.847c2.951-0.708,5.885-0.673,8.237-0.591c0.713-1.595,0.733-3.34,1.47-4.93
	c-3.5-0.574-8.334-0.877-12.968,0.417C115.736,111.43,115.129,112.256,114.58,113.1z"/>
<path d="M98.014,121.23c-1.004-0.082-2.028-0.105-3.059-0.057c-3.858,2.875-6.576,6.884-8.262,10.004
	c1.708,0.389,3.102,1.44,4.798,1.852c1.375-1.91,3.142-4.252,5.506-6.154c0.355-0.004,0.709,0.003,1.059,0.018
	c0.35-0.02,0.703-0.031,1.058-0.033c2.393,1.865,4.196,4.182,5.598,6.071c1.691-0.437,3.07-1.509,4.77-1.923
	c-1.732-3.097-4.51-7.062-8.41-9.879C100.041,121.094,99.017,121.134,98.014,121.23z"/>
<path d="M81.329,113.35c-0.562-0.837-1.182-1.652-1.864-2.428c-4.652-1.225-9.481-0.851-12.972-0.223
	c0.761,1.576,0.807,3.322,1.544,4.906c2.35-0.117,5.283-0.196,8.244,0.469c0.225,0.275,0.44,0.555,0.647,0.838
	c0.233,0.26,0.462,0.529,0.685,0.807c0.034,3.033-0.654,5.886-1.256,8.162c1.396,1.049,3.093,1.457,4.478,2.529
	c1.34-3.284,2.71-7.931,2.48-12.735C82.699,114.848,82.03,114.072,81.329,113.35z"/>
<path d="M77.088,95.389c0.303-0.961,0.555-1.954,0.736-2.97c-1.944-4.401-5.247-7.943-7.915-10.28
	c-0.759,1.578-2.095,2.703-2.873,4.266c1.557,1.765,3.447,4.009,4.774,6.738c-0.075,0.348-0.16,0.69-0.252,1.028
	c-0.059,0.346-0.126,0.692-0.204,1.04c-2.351,1.917-5.009,3.159-7.164,4.107c0.05,1.745,0.788,3.327,0.814,5.078
	c3.403-0.999,7.889-2.825,11.502-6.001C76.771,97.395,76.959,96.389,77.088,95.389z"/>
<path d="M88.485,80.876c0.941-0.362,1.873-0.784,2.781-1.276c2.229-4.263,2.938-9.054,3.103-12.598
	c-1.707,0.391-3.419,0.048-5.127,0.414c-0.41,2.318-0.985,5.195-2.292,7.934c-0.318,0.158-0.639,0.305-0.961,0.444
	c-0.306,0.17-0.62,0.333-0.939,0.488c-2.965-0.642-5.594-1.947-7.677-3.041c-1.333,1.127-2.11,2.69-3.463,3.803
	c2.903,2.037,7.128,4.407,11.864,5.251C86.719,81.879,87.624,81.399,88.485,80.876z"/>
<path d="M127.692,75.804c-0.769-0.726-1.491-1.438-1.507-1.819c-4.055,2.854-7.452,6.52-10.047,11.176
	c5.094-1.57,9.385-4.131,13.02-7.504C128.79,77.562,128.243,76.706,127.692,75.804z"/>
<path d="M135.35,108.23c0.088-1.054,0.194-2.063,0.482-2.312c-4.759-1.392-9.743-1.762-15.002-0.889
	c4.404,3.005,9.082,4.764,13.986,5.502C134.658,110.184,134.987,109.222,135.35,108.23z"/>
<path d="M114.771,134.433c0.879-0.587,1.734-1.134,2.109-1.064c-1.88-4.589-4.697-8.716-8.66-12.282
	c0.397,5.316,1.939,10.07,4.42,14.364C112.814,135.111,113.77,134.768,114.771,134.433z"/>
<path d="M81.456,134.682c1.007,0.32,1.968,0.648,2.147,0.986c2.415-4.332,3.885-9.107,4.203-14.429
	c-3.908,3.624-6.664,7.794-8.475,12.411C79.705,133.574,80.568,134.107,81.456,134.682z"/>
<path d="M60.489,108.789c0.377,0.988,0.72,1.943,0.567,2.293c4.893-0.811,9.543-2.64,13.902-5.709
	c-5.271-0.795-10.249-0.351-14.987,1.111C60.262,106.73,60.384,107.738,60.489,108.789z"/>
<path d="M67.659,76.253c-0.537,0.911-1.07,1.774-1.438,1.875c3.685,3.318,8.015,5.814,13.131,7.309
	c-2.665-4.617-6.116-8.231-10.213-11.025C69.129,74.792,68.416,75.516,67.659,76.253z"/>
<path d="M97.568,61.572c-1.046,0.148-2.055,0.27-2.362,0.044c-0.297,4.95,0.451,9.892,2.473,14.823
	c1.948-4.961,2.622-9.914,2.251-14.858C99.626,61.812,98.617,61.706,97.568,61.572z"/></g>
  </svg>
</div></g>
  </svg>
</div>
            
          
!
            
              body {
  background: #3AA89B;
}

.wrapper {
  height: 2000px;
}

svg {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
            
          
!
            
              var $doc = $(document),
    $win = $(window),
    $svg = $('svg').drawsvg(),
    max = $doc.height() - $win.height();

$win.on('scroll', function() {
  var p = $win.scrollTop() / max;
  $svg.drawsvg('progress', p);
});
            
          
!
999px
🕑 One or more of the npm packages you are using needs to be built. You're the first person to ever need it! We're building it right now and your preview will start updating again when it's ready.
Loading ..................

Console