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 class="container">
	<svg id="initials" xmlns="http://www.w3.org/2000/svg" height="297" width="210" version="1.1" viewBox="0 0 744.1 1052.4">
		<path id="path1" d="m78.3 542.9c-5.5-5.5-4-8.8 8.5-17.7 7.7-5.5 14.3-13.8 19.1-23.9 6.8-14.4 7.4-19.1 8.5-63.9l1.1-48.4-11.2-3c-26-6.9-29.3-6.9-36.5-0.3-7.8 7.3-15.7 5.9-15.7-2.7 0-3.2 9.3-19.7 20.7-36.7l20.7-31 10.9 1.7 10.9 1.7-1-35.8c-0.9-33.6-1.4-36.1-7.7-41.1-9.8-7.8-30.7-7.3-39.7 1l-6.9 6.3 2-12.7c3.3-21.3 17.6-35.9 37.9-38.6l11.6-1.5 1.9-16.3c1.1-8.9 1-23.5-0.1-32.2-1.8-14.5-3-16.6-13.1-23.2l-11-7.2 24.1-8c35.9-11.9 58-23.4 107-55.4 50.1-32.8 47.1-32.2 77.5-14.5 26.5 15.5 35.8 23.8 43.9 39.6l7 13.6v109.8c0 63.2 1.2 112.8 2.7 116.9 1.5 3.9 7.6 9.6 13.5 12.6l10.8 5.5-11 4.5c-6 2.5-11.6 4.5-12.4 4.5-5.4 0-41.8 25.5-70.6 49.5l-34.3 28.5-10.6-3.6-10.6-3.6v27.9c0 15.3 1.5 31.1 3.2 34.9 3.4 7.4 14.7 12.6 23.2 10.8 4.7-1 4.6-1.6-0.7-8.3-7.1-9-7.3-15.2-0.5-23.5 11.8-14.4 37.5-3.2 37.5 16.5 0 7.5-2.5 12.2-10.8 20.4-13 12.8-27.3 16.5-42.4 10.8-20.1-7.6-26.4-23.7-26.5-67.8 0-15-1.2-28-2.5-28.8-1.3-0.8-7.7-2.3-14.3-3.3l-11.8-1.9 0 26.4c0 33.5 3.5 46.9 12.9 49.2 10.1 2.5 9.5 13.8-1.1 19.2-8.2 4.2-108 46.7-109.6 46.7-0.5 0-2.4-1.5-4.3-3.4zm201.9-206.1c0-14.5 0.9-41.9 1.9-61 2.2-40.6 4-39.7-29-15.2l-21.5 16 0.8 36.7 0.8 36.7 17.1 6.5c9.4 3.6 20 6.5 23.5 6.6 6.2 0.1 6.4-0.7 6.4-26.2zm-68.4-124.4c0-93.3-0.9-131-3.1-131-5.4 0-19.4 16.9-22.9 27.7-2.2 6.9-3.8 46.4-4.6 117.4l-1.3 107.1 12.4 4.6c6.8 2.5 14 4.7 15.9 4.9 2.8 0.3 3.6-27.6 3.6-130.7zm54.6 12.9c8.8-6.7 13.7-12.7 14.5-17.9 1.6-10-0.1-9.4-27.3 11.1-18.3 13.8-21.9 17.8-21.9 24.6l0 8.1 10.7-7.9c5.9-4.3 16.7-12.4 24-17.9zm-6.5-35.4 23.7-16.9-1-24c-0.6-13.5-2.9-27.6-5.2-32.3-4.2-8.3-35.2-32.2-42-32.4-2.7-0.1-3.6 14.2-3.6 62.1 0 34.2 1 61.8 2.2 61.3 1.2-0.5 12.9-8.5 25.9-17.8zm283.6 228.2c-68.2-12.2-117.6-45.8-143.2-97.2-14.5-29.3-20.2-54.8-20.3-91.1-0.1-71.1 41.5-129.4 125.9-176.3 17.6-9.8 32.3-14.9 35.1-12.1 1 1 4 1.9 6.6 2.1 19.4 1.2 19.3 1.4-2.9 12.5-36.3 18-60.3 36-43.1 32.4 16.3-3.5 60.2-26.8 91.6-48.6l32.2-22.4 32 14.1c29.5 13 32.6 13.8 40.6 10.6 4.7-1.9 12.7-4.1 17.8-4.9 8.2-1.2 9.3-0.6 9.3 5.1 0 8.6-46.7 54.9-58.1 57.7-5.1 1.2-13.6 0.3-22.1-2.3l-13.8-4.4v132.2 132.2l7.8-1.9c17.7-4.3 31.6-10.3 48.3-21.1 9.7-6.3 20.2-11 23.4-10.4 5.4 0.9 5.1 2.3-5.5 27.7-19.6 46.9-26.1 57.3-38.4 61.4-27.9 9.2-85.9 11.6-123 4.9zm61.8-197v-139.2l-9-3.1c-20.3-7-18.8-14.2-20.1 97.6-1.1 96-1.4 101.3-7.2 112-7.8 14.6-23.7 29.6-44.5 41.9l-16.6 9.8 8.1 4.1c15.8 8.1 49.1 14.9 75.8 15.6l13.5 0.4v-139.2zm-102.9 93.1c5.2-8.4 6-13.9 6-45.8 0-28.9-1-38.3-5-46.1-8.1-16-24.5-15.1-36.3 2.1l-7.2 10.5v-12.4c0-25.7 18.3-48 39.5-48l9.6 0-1.1-29.4c-1.2-31.1-5.3-41.1-17.1-41.1-2.9 0-5.3-1.6-5.4-3.5-0.2-6.7-23.4 21.9-33 40.9-13.8 27.1-18.9 51.4-17.6 84.2 1 25.2 1.9 28.9 13.1 51.1 6.6 13.2 17.9 30.4 25.1 38.3 14.8 16.3 19 16.2 29.5-0.6zm-413.2-231.6c-14.9-6.8-30.9-12.3-35.6-12.3-4.8 0-14.1 3.7-21 8.4-6.9 4.6-13.6 7.7-15 6.8-4.7-2.9-2.5-19.5 4.1-30.1 8.1-13.3 29.2-28.3 46.2-33 12.4-3.4 14-3.1 43.5 8.6 37.9 15.1 61.8 17.7 79.6 8.7 8.6-4.3 12.3-5 14.7-2.5 6.3 6.2 3.1 12.9-10.3 21.4-14.3 9.1-63.7 32.7-73.4 35.1-3.3 0.8-17.2-3.8-32.8-10.9z"
		fill="#8bb7eb" />
		<path id="path2" d="m77.4 541.6c-3.1-3.7-1.4-6.3 11.2-17.5 22.2-19.7 24.3-26.9 25.6-85.5l1.1-49.8-15-4.4c-19.9-5.8-29.2-5.6-35.2 1-5.7 6.2-13 4.8-13-2.6 0-4.4 32.5-55.2 41-64.1 2.4-2.5 6-2.8 12.5-0.9l9.2 2.6v-34.9c0-32.8-0.4-35.3-6.9-42.8-6.1-7-8.6-7.8-21.8-7.3-8.8 0.4-16.9 2.4-19.8 5-4.7 4.2-4.8 3.7-2.9-6.8 1.1-6.2 4.3-14.6 7-18.7 5.6-8.4 24.9-18 36.5-18.1l7.8-0.1v-28c0-33.1-2.3-40.3-14-45.2-4.8-2-8.8-4.4-8.8-5.4 0-1 8-4.1 17.8-6.9 29.8-8.6 66.9-27.7 112.7-58l43.6-28.8 15.4 7c28 12.7 49.4 29 58.6 44.9l8.5 14.7 0 112.2c0 73.8 1.1 114.1 3.1 117.8 1.7 3.1 7 8 11.8 10.9l8.8 5.3-18.8 8.4c-24.2 10.8-39.1 21.1-75.4 51.9-30.4 25.8-31.4 26.2-47.5 20.1-4-1.5-4.5 2.1-4.5 29.7 0 29.6 0.4 31.8 7 38.3 6.9 6.9 14 8.5 22.7 5.2 3.8-1.4 3.5-2.4-1.7-6.6-7-5.6-8.3-19.8-2.5-26.8 2.1-2.5 8.2-4.4 14.2-4.4 13.4 0 23 9.2 23 22.3 0 18.2-28.6 36.8-48.1 31.3-24.2-6.8-29.3-17.4-31.1-63.9l-1.3-34.3-9.8-1.8c-5.4-1-11.6-2.5-13.9-3.4-3.4-1.3-4 3.6-3.8 29 0.3 37 2 43.6 12 48.3 11.7 5.6 9.7 12.6-5.8 20.1-14.6 7.1-70.8 31.2-92.4 39.8-11.9 4.7-13.7 4.8-16.9 0.9zm202.5-179.6c2.3-2.7 3-21.9 2.5-63.6l-0.8-59.7-24.9 18.6-24.9 18.6v37.3 37.3l20.7 7.5c24.8 9 23.5 8.8 27.5 4zm-68.1-149.7c0-140.1 0.1-139.1-13.6-124.6-15.8 16.6-16.2 20.2-17.2 137.7l-0.9 108.9 12.3 4.3c6.7 2.4 13.9 4.4 15.8 4.5 2.8 0.2 3.6-27.7 3.6-130.8zm47.2 19.5c20.6-15.9 24-19.8 24-26.9 0-9.9 0.8-10.2-29.2 12.6-18.4 14-22.1 18.2-22.1 24.8 0 4.4 0.7 8 1.6 8 0.9 0 12.4-8.3 25.7-18.5zm0.1-40.8 24-17.1v-22.3c0-36-7.8-47.6-44.9-67.1l-6.4-3.4v63.5c0 34.9 0.8 63.5 1.7 63.5 0.9 0 12.5-7.7 25.7-17.1zm296.2 228.5c-88-12.4-144-55.8-167.2-129.7-5.5-17.7-6.6-27.1-6.5-57.8 0.1-32.5 0.9-38.8 7.5-55.6 20.5-52.9 59.9-92.9 123.8-125.7 14.9-7.7 19.4-8.7 32.6-7.4 8.4 0.8 15.8 1.9 16.3 2.5 0.6 0.6-7.4 5-17.7 9.8-22 10.2-54.7 32.2-50.1 33.7 11.2 3.7 56.4-19.1 107.2-54.1l24.1-16.6 31.7 13.5 31.7 13.5 13.3-4.7c17.6-6.2 23.3-6 23.3 0.9 0 6.6-31.8 40.8-48.6 52.3-10.8 7.4-12.5 7.8-23.6 4.8-6.5-1.7-14.2-4-16.9-5.1-4.7-1.8-5 5.6-5 131v132.9l9.3-1.9c13-2.7 36.8-13.5 51.7-23.7 12.7-8.6 21.7-11.1 21.7-5.9 0 4.3-16.3 43.7-25.7 62.1-9.9 19.3-15.4 23.5-37 28-21.1 4.3-74.4 6-95.6 3zm50-198.6v-139.1l-10-3.2c-20.2-6.6-19-12.4-20.1 98-0.9 94.6-1.2 100-7 111.8-7.1 14.5-21.3 27.8-43.7 41.1-8.9 5.3-16.2 10.4-16.2 11.3 0 2.1 19.2 9.4 36.5 13.8 13.5 3.5 54.9 8 58.3 6.4 1.2-0.6 2.1-63.6 2.1-140.1zm-105.6 97.8 8.9-10.6-0.9-42.7c-0.7-37.3-1.5-43.4-6.3-48.6-9-9.8-22.4-7.9-32.9 4.6-8.4 10-8.8 10.2-8.7 3.5 0.1-24.5 16.6-47.2 36.3-49.8l12.1-1.6v-27.4c0-23.5-0.9-28.5-5.9-34.8-3.3-4.1-7.7-7.4-9.8-7.4s-5.1-2-6.5-4.5c-2.1-3.7-4.7-1.8-14.4 10.2-34.2 42.4-47.9 106.5-32.2 150.4 9.8 27.4 39 69.2 48.3 69.2 1.6 0 7-4.8 11.9-10.6zm-414.8-238.9c-31.3-13.8-36.5-14-52.2-2.3-12.8 9.6-18.9 7.1-16.4-6.8 2.5-13.5 14.2-28.1 31-38.4 22.5-13.8 30.7-13.8 66.3 0 42.1 16.3 53.7 17.7 73.5 8.7 11.3-5.1 16.4-6.2 18.6-3.9 4.7 4.7 3.8 8.8-3.3 15.3-8.6 7.9-75.5 40.2-83.1 40.1-3.3-0.1-18.9-5.8-34.5-12.7z"
		fill="#498fe1" />
		<path id="path3" d="m103.4 525.5c0-0.9 3.1-6.1 7-11.7 10.7-15.6 13.5-34.5 12.5-85.9l-0.9-46.5-14.3-4.7c-7.8-2.6-19.7-4.8-26.4-4.9-6.7-0.1-12.1-1-12.1-1.9 0-0.9 6.6-11.1 14.7-22.7 15.6-22.3 14.8-21.9 34.1-16.3 9.8 2.9 10.3-71.1 0.5-89.9-4.8-9.3-19.1-16-34.1-16h-10.6l6.7-7c7-7.4 21.5-12.6 34.9-12.7l7.8 0v-35.4c0-25.6-1.2-37.6-4.2-43.4-4.1-7.8-4-8.1 3.6-9.9 4.3-1 18.5-6.9 31.7-13 13.2-6.1 25-11.1 26.2-11.1 1.3 0 0.1 4.8-2.5 10.6-4.3 9.3-4.9 24.5-5.7 125.1l-0.9 114.5 14.4 3.4c7.9 1.9 18.8 6.4 24.2 10 5.7 3.8 10.2 5.3 10.8 3.6 0.6-1.8 11.5 0.6 28.3 6.4 26.5 9.2 27.4 9.3 34.8 4.5l7.6-4.9-0.1-120.2c-0.2-146 2.3-135.5-38.1-161.9-15-9.8-27.3-18.6-27.3-19.6-0.1-3 38.1-27.8 42.7-27.8 4.8 0 41 20.2 49.6 27.7 3 2.6 9.1 10.3 13.5 17.2l8.1 12.5v114.3c0 102.6 0.5 115 4.8 121.1 4.5 6.4 4.5 6.9-0.4 9.8-22.7 13.2-49.9 32.6-72.2 51.5l-26.4 22.5-27.8-9.1c-15.3-5-31.9-10-37-11.1l-9.3-1.9v38.3c0 38.1 3.9 57.9 11.3 57.9 9.6 0-1.3 6.7-33.4 20.6-43.8 18.9-46.3 19.9-46.3 17.9zm161.8-44.6c-10.3-7.4-10.9-19.3-0.9-19.3 12.7 0 21 14.8 12.3 22-2.6 2.1-5.8 1.3-11.4-2.7zm294.5-70.2c-82.4-10-139.4-52-161.6-119.3-9.9-29.8-11.2-81.3-2.8-105.9 13.1-38.3 41.2-74.5 77.7-100.3 9.6-6.8 18.4-12.4 19.6-12.4 1.2 0-6.9 9.4-18 21-40.6 42.2-59.8 104.5-47.8 154.8 5.9 24.8 20.9 53 38.8 72.8 10.5 11.7 20 18.4 37.6 26.9 27.1 13 42.1 17 77.2 20.6 40.3 4.1 36.3 20.9 35.5-148.7l-0.7-145.4-16.8-5.5c-15.5-5.1-17.4-5.2-24.2-1.1l-7.4 4.4-1.4 103.7-1.4 103.7-7.3 10.5c-8.4 12-24.9 25.7-40.4 33.5-12.1 6.1-13.2 5.1-5-5.2 5.1-6.4 5.7-11.4 5.7-49.7 0-34.9-0.9-44.4-5-52.4-6.2-12.3-16.2-17.6-29-15.4-9.7 1.7-9.7 1.6-5.4-4.9 5.9-8.8 15.8-13.5 28.7-13.6l10.7 0v-34.8c0-31.1-0.6-35.6-6-42.3l-6-7.5 9.5-3.2c18.2-6.2 55.3-26.8 83.4-46.5l28.3-19.7 31.6 13.6c20.1 8.7 33.7 13 37.3 11.9 3.1-1 7.6-2.4 10-3.2 6.3-2.1-28.7 32.9-37.5 37.5-6.7 3.5-9.6 3.3-25.1-1.9-9.7-3.2-18.2-5.3-18.9-4.5-0.8 0.7-2.2 65.7-3.2 144.4l-1.8 143 11.2-1.9c18.7-3.3 39-10.6 53.4-19.4 7.5-4.6 14.2-7.8 14.9-7.1 2.1 2-24.1 57.1-28.8 60.5-10.7 7.8-75.6 13.3-109.5 9.2zm-471.9-339.4c-32.1-14-38.8-14.9-52-6.9-5.1 3.1-9.3 4.7-9.2 3.5 0-5.3 12.1-19.3 22.9-26.4 16.5-11 29.3-12.9 45.3-6.7 38.2 14.6 60 21.1 71.5 21.4l12.8 0.2-28.3 13.9c-15.5 7.6-29.7 13.8-31.4 13.7-1.7-0.1-15.9-5.8-31.6-12.6z"
		fill="#4487d8" />
		<path id="path4" d="m108.4 518.8c11.4-16.1 15.1-34.3 16.9-83 1.4-36.3 0.9-48.1-1.9-51.4-4.5-5.3-31.3-13.3-44.7-13.3h-9.8l4.9-7.5c27.1-41.3 23.6-38.6 44.3-32.6 4 1.2 5.1-1.7 6.8-17.5 2.3-21.5 0.1-58.3-4.2-69.5-4.1-10.6-19-18.8-34.2-18.8l-12.6 0 6.7-7c7-7.4 21.6-12.6 35.1-12.7l8.1 0-1-38.7c-0.6-21.3-2-40.7-3.1-43.1-1.6-3.3 1-5.5 11.5-9.2 7.5-2.7 21.3-8.6 30.7-13.1 9.4-4.5 17.3-8 17.6-7.7 0.3 0.3-1.3 7.5-3.5 15.9-3.2 12-4 39.4-4 124.1v108.7l19.7 6.3c10.8 3.4 21.3 8.2 23.3 10.5 2.6 3.1 4.2 3.4 5.7 1 1.5-2.4 8.5-0.9 25.4 5.5 27 10.2 34.4 10.8 41 3.6 4.3-4.7 4.7-17.2 4.6-126.1-0.2-145.8 2.4-134.9-38.2-160.3-14.8-9.3-27.1-17.7-27.1-18.6-0.1-0.9 9-7.7 20.1-15 14-9.2 22.2-12.8 26.4-11.8 3.4 0.8 16.4 8.2 28.9 16.4 17.9 11.7 24.5 17.9 30.6 29l7.8 14.1 0.1 112.8c0.1 98.8 0.6 113.6 4.6 119.2 2.5 3.5 4.1 6.8 3.6 7.1-0.6 0.4-10.6 6.6-22.4 13.8-11.8 7.2-34.2 23.9-49.9 37.1s-30.1 24-32 24c-1.9 0-10.2-2.4-18.5-5.4-13.6-4.9-47.5-14.2-51.8-14.2-3 0-1.9 75.3 1.3 83.6 1.6 4.4 5.1 9.5 7.6 11.4 2.6 1.9 4.1 4 3.4 4.6-1.8 1.6-53.3 24.2-69.2 30.4l-13.8 5.4 5.5-7.8zm155-39.8c-8-6.1-7.3-15.5 1.2-16.7 8-1.1 16.5 8.7 14.1 16.1-2.3 7.1-6.5 7.3-15.3 0.6zm300.9-68.2c-53.1-5.7-94.4-23.3-124.3-53-29.9-29.6-46-65.5-50.4-111.9-5.4-57.7 26-119.4 80.3-157.7 9.7-6.9 18.3-12.5 19.2-12.5 0.8 0-6.2 7.9-15.5 17.6-33 34.1-53.6 90.1-49.9 135.9 5 62.8 48.1 114.4 110.3 132.1 19.7 5.6 66.3 10.8 75.6 8.5l7.1-1.8-0.7-146.8-0.7-146.8-18.8-5.6-18.8-5.6 23.1-16.3c12.7-8.9 24.4-16.3 26-16.3 1.6 0 16.2 5.8 32.4 12.8 25.9 11.3 30.5 12.5 38.2 9.8 4.8-1.6 9.1-2.5 9.6-2 1.4 1.4-33.7 34.2-40.4 37.8-4.4 2.3-10.5 1.5-26.4-3.5l-20.7-6.5v144.8c0 128.7 0.5 144.8 4.4 144.8 11.7 0 43-10.1 57-18.5 8.6-5.1 15.6-7.8 15.6-6s-5.9 15.5-13.2 30.4c-14.7 30.3-16.2 31.3-50.3 34.7-35.2 3.5-47.1 3.7-68.6 1.4zm-53.8-90.5c5.7-9.1 6.2-13.7 6.2-51.3 0-45.4-2.7-57-15.5-65.2-5.1-3.3-10.6-4.3-17.6-3.2-9.2 1.5-9.8 1.2-6.5-3.2 7.2-9.5 12.4-11.8 25.9-11.8h13.7v-36.2c0-32.7-0.6-37-6-43.8l-6-7.6 6.8-1.7c3.7-1 17.3-7 30.3-13.4l23.5-11.7-0.1 100.2c-0.1 91.1-0.5 101.2-5.3 111.6-5.8 12.6-24.5 30.1-43.3 40.5l-12.3 6.8 6.2-10zm-421.5-249c-29.4-13.4-38.4-14.8-51.7-8-12.6 6.4-12.9 3.3-1.1-9.7 11-12 30.5-23 40.8-23 3.4 0 19.3 5.2 35.4 11.5 16.1 6.3 37 12.5 46.4 13.6l17.1 2.1-27.8 13.1c-15.3 7.2-28.7 13-29.9 12.9s-14.4-5.8-29.3-12.6z"
		fill="#3978c7" />
		<path id="path5" d="m113.8 510.3c9.2-18.4 12.3-40.1 12.4-85.5 0-45.4 0.1-45.2-31.5-52.2-11.7-2.6-21.6-5-22.1-5.4-0.5-0.4 5.3-9.7 12.8-20.5 12.2-17.5 14.6-19.6 20.9-18 18.8 4.5 18.5 5 19.4-28.9 1.2-43.3-0.8-54-12.2-65.3-7.9-7.9-11.5-9.3-22.6-9.3-7.2 0-13.1-1.3-13.1-2.9 0-5.1 17.5-13.6 31.9-15.5l14-1.9-0.9-38.5c-0.5-21.1-1.9-40.5-3.2-43-1.7-3.5-0.4-5 5.7-6.6 4.4-1.1 18.6-6.9 31.5-12.8 12.9-6 23.5-10.6 23.5-10.4 0 0.3-1.9 5.6-4.2 11.8-3.3 9.1-4.1 33.2-4.2 124.6l-0.1 113.3 12.1 3.2c6.7 1.7 17.5 6.1 24.1 9.7 6.6 3.6 12.4 5.4 12.8 3.9 0.5-1.4 11.5 1.2 24.5 5.9 26.6 9.6 35.3 10.5 41.8 4.1 3.9-3.9 4.5-19.2 4.5-125.3 0-147.7 2.6-136.6-37.8-162.4l-28.3-18.1 20.6-14c24-16.3 23.2-16.4 58.2 6.2 16.8 10.9 21.9 15.9 28.1 28.2l7.5 15v111.5c0 100.1 0.5 112.2 4.8 118.3 3.1 4.3 3.7 7.2 1.7 7.8-10.6 3.5-42.4 25.6-69.7 48.4l-31.7 26.5-13.1-5c-16-6.1-51.2-15.5-58-15.6-4.4 0-5 3.1-5 27.4 0 33.8 4 58.9 10.3 65.9 2.7 2.9 4.1 5.9 3.3 6.7-1.8 1.8-61.8 28.1-69.8 30.6-5.6 1.7-5.5 1.4 1-11.7zm151.2-30.6c-9.8-5.2-9.8-16.1 0-17.5 7.4-1 16.2 10.3 13.5 17.4-2.2 5.6-3.2 5.6-13.5 0.1zm274.6-72.9c-94-18.7-148.4-82.4-148.8-174.7-0.1-21.2 1.3-32.7 5.8-46.5 10.7-33 34.9-67.2 62.9-89.2 23.1-18.2 29-20.5 15.9-6.3-25.6 27.6-40.1 54.5-48 89-11.6 50.5-2.5 90.9 30.5 135.1 14.6 19.6 39.4 35.9 69.5 45.8 20.3 6.7 70.8 13.1 81.8 10.4l7.4-1.8v-147.4-147.4l-18.9-5.6-18.9-5.6 23.5-16.3 23.5-16.3 31.6 13.4c27.3 11.5 32.7 12.9 39.6 10.4 4.4-1.6 8-1.9 8-0.6 0 5-38.1 36.6-44.2 36.6-3.4 0-13.7-2.5-22.8-5.6-9.1-3.1-17-5.6-17.6-5.6-0.5 0-1 65.8-1 146.2v146.2l19.2-4.2c10.6-2.3 27.5-8.5 37.6-13.8 10.1-5.2 18.9-9 19.5-8.4 2.4 2.4-24.7 54.7-29.7 57.3-16.7 8.8-92.2 11.6-126.5 4.8zm-27-87.7c4.5-6.6 5.7-14.4 6.6-41.8 1.4-42.5-2.3-60.6-14.5-70.7-6.7-5.5-11.3-7.1-18.4-6.3-11.2 1.3-11.7-0.3-2.9-8.6 4.8-4.5 10.2-6.1 20-6.1h13.4l-0.1-37.3c-0.1-28.4-1.1-38.6-4.3-42.8-4-5.2-2.8-6.2 23.6-19 15.3-7.4 28.2-13.5 28.7-13.5 0.5 0 0.5 46 0 102.3l-0.9 102.3-7.9 11.8c-7.8 11.6-23.9 25-40.4 33.5l-8.4 4.3 5.5-8.1zm-419.3-246.7c-30.2-13.5-46.5-16.3-56.8-9.6-9.4 6.1-9.1 1.6 0.5-9.8 7.6-8.9 32.1-22.3 41-22.3 2.5 0 17.2 5.2 32.8 11.5 18.6 7.6 34.6 12.1 46.6 13.1l18.3 1.6-19.7 9.9c-37.8 18.9-33.9 18.5-62.6 5.6z"
		fill="#2358a1" />
		<path id="path6" d="m111.7 516.1c10.6-14.4 14.5-38 14.5-87.5v-46l-12.1-5.3c-6.7-2.9-18.8-6.2-26.9-7.2l-14.8-1.9 13.2-19.6c12.8-19 13.5-19.5 22.8-17.8 5.3 1 11.5 2.5 13.7 3.3 5.9 2.2 5.9-76.6 0-90.5-5.3-12.6-15.7-18.9-31.2-19.1-22.7-0.3-8.1-13.2 18.1-15.9l15.7-1.7v-35.2c0-19.4-1-39.2-2.3-44-2.1-8.1-1.6-9 5.7-10.8 4.4-1.1 17.4-6.3 28.9-11.6 14.5-6.6 20.5-8.3 19.4-5.4-6 15.5-7.6 48.6-6.9 141.8l0.8 102.5 18.5 5.6c10.2 3.1 21.5 8.3 25.1 11.6 5.2 4.8 7.1 5.2 8.9 2.2 1.9-3 7.2-2 26.6 5.1 26.2 9.5 35.8 9 41.9-2.3 2-3.7 3-45.1 2.8-124-0.3-142.8 2.1-133.1-38.8-159.5-14.4-9.3-26.3-17.7-26.4-18.6-0.1-0.9 8.6-7.5 19.4-14.5l19.6-12.8 14.8 7.5c22.4 11.3 40.8 26.1 47.9 38.6 6.3 11.1 6.4 12.3 6.5 121.9 0 93.4 0.7 112.3 4.5 121.1 2.4 5.7 3.3 10.8 1.9 11.3-7.9 2.6-48.2 31.3-69.8 49.6-13.8 11.7-26.1 21.9-27.5 22.8-1.4 0.8-7.4-0.6-13.5-3.1-10.3-4.3-56.9-17.8-61.6-17.9-1.2 0-2.1 17.1-2.1 37.9 0 28.3 1.2 40.9 4.6 49.3 2.5 6.2 5.8 11.3 7.3 11.3 9.4 0-12.5 11.1-64.1 32.4l-10.9 4.5 5.8-7.9zm152.7-38.7c-6.4-5.1-7.7-7.6-5.3-10 5.5-5.5 16.6-2.2 17.7 5.3 1.5 10.4-3.1 12.1-12.4 4.7zm288-69.4c-99.3-14-160.8-81.2-161-175.9-0.1-28 5.5-49.7 19.3-75.7 11.6-21.8 40.1-53.6 60.4-67.3l12.9-8.7-16.2 17.7c-39.5 43.3-56.2 112.6-39.7 164.1 6.4 20 28.3 55.2 42.3 68.1 26.1 24.1 69.9 39.1 116.3 39.6l28.5 0.4 0.7-148.5 0.7-148.5-15.7-4.9c-8.6-2.7-15.7-5.8-15.7-7 0-2.8 37.6-28.7 41.7-28.8 1.8 0 15.7 5.4 30.9 12 18.9 8.2 30.4 11.6 36.2 10.8 8.1-1.2 7.8-0.6-8.1 15.3-9.1 9.1-19.1 17.2-22.3 18-3.1 0.8-13.3-1.2-22.5-4.3-9.3-3.2-17.9-5.7-19.2-5.7-1.3 0-2.4 65.9-2.4 146.5 0 80.6 1 146.5 2.1 146.5 10.5-0.2 42.6-10.5 56.9-18.3l17.7-9.6-6.7 14.7c-16.2 35.8-19.8 41.3-28.7 44.2-23.2 7.6-74.9 10.1-108.5 5.4zm-37.3-92.2c3.5-6.7 4.5-17.5 4.5-47.5-0.1-53-7.1-68.5-31.1-68.5-4.8 0-8.7-1.2-8.7-2.7 0-5.7 13.2-11.4 26.3-11.4h13.6l0-33.1c0-25.9-1.1-35.2-5-42.9l-5-9.8 25.3-12.1c13.9-6.7 26.1-11.3 27.1-10.4 3.3 3.3 1.2 191.6-2.3 202-3.9 11.6-21.3 29.5-37.6 38.5l-11.6 6.4 4.5-8.6zm-426-246.1c-25-11.7-45.3-15-52-8.4-5.9 5.8-8.2 3.5-3.5-3.5 5.8-8.8 23.3-20.1 36.5-23.7 9.3-2.5 13.8-1.5 41.1 9.3 16.9 6.7 37.1 13.1 44.9 14.2l14.3 2.1-23.8 10.9c-13.1 6-25.9 10.8-28.5 10.7-2.6-0.1-15.6-5.3-28.9-11.6z"
		fill="#002262" />
	</svg>
<p class="button">Refresh</p>
</div>
              
            
!

CSS

              
                @import "compass/css3";

.container {
	margin: 10px auto 0 auto;
	text-align: center;
	width: 400px;
}
#initials {
	display: inline;
}

p.button {
	cursor: pointer;
	float: right;
	color: #002363;
	border: 2px solid #002363;
	display: inline-block;
	padding: 10px 10px;
	text-transform: uppercase;

	@include transition(all .15s ease-in-out);
	
	&:hover {
		background: #4A90E2;
		border-color: #002363;
		color: #fff;
	}
}
              
            
!

JS

              
                window.onload = function() {
 
  // Run the animation on click
  $('.button').on('click', function(){
    animate();
  });

  function animate() {
    $('#path1')
      .velocity({ opacity: 0 }, 0)
      .velocity({ opacity: 1 },{duration: 1000, delay: 10});
		$('#path2')
      .velocity({ opacity: 0 }, 0)
      .velocity({ opacity: 1 },{duration: 1000, delay: 10});
		$('#path3')
      .velocity({ opacity: 0 }, 0)
      .velocity({ opacity: 1 },{duration: 1000, delay: 10});
		$('#path4')
      .velocity({ opacity: 0 }, 0)
      .velocity({ opacity: 1 },{duration: 2000, delay: 100});
		$('#path5')
      .velocity({ opacity: 0 }, 0)
      .velocity({ opacity: 1 },{duration: 2000, delay: 100});
		$('#path6')
      .velocity({ opacity: 0 }, 0)
      .velocity({ opacity: 1 },{duration: 2000, delay: 100});
	}
  
  animate();
};
              
            
!
999px

Console