Pen Settings

HTML

About HTML Preprocessors

HTML preprocessors can make writing HTML more powerful or convenient. For instance, Markdown is designed to be easier to write and read for text documents and you could write a loop in Pug.

Learn more · Versions

Adding Classes

In CodePen, whatever you write in the HTML editor is what goes within the <body> tags in a basic HTML5 template. So you don't have access to higher-up elements like the <html> tag. If you want to add classes there that can affect the whole document, this is the place to do it.

About the <head>

In CodePen, whatever you write in the HTML editor is what goes within the <body> tags in a basic HTML5 template. If you need things in the <head> of the document, put that code here.

!
Insecure Resource

The resource you are linking to is using the 'http' protocol, which may not work when the browser is using https.

CSS

About CSS Preprocessors

CSS preprocessors help make authoring CSS easier. All of them offer things like variables and mixins to provide convenient abstractions.

Learn more · Versions

CSS Base

About CSS Base

It's a common practice to apply CSS to a page that styles elements such that they are consistent across all browsers. We offer two of the most popular choices: normalize.css and a reset. Or, choose Neither and nothing will be applied.

Vendor Prefixing

About Vendor Prefixing

To get the best cross-browser support, it is a common practice to apply vendor prefixes to CSS properties and values that require them to work. For instance -webkit- or -moz-.

We offer two popular choices: Autoprefixer (which processes your CSS server-side) and -prefix-free (which applies prefixes via a script, client-side).

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.

Powered by Algolia
About External Resources

You can apply CSS to your Pen from any stylesheet on the web. Just put a URL to it here and we'll apply it, in the order you have them, before the CSS in the Pen itself.

If the stylesheet you link to has the file extension of a preprocessor, we'll attempt to process it before applying.

You can also link to another Pen here, and we'll pull the CSS from that Pen and include it. If it's using a matching preprocessor, we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.

Learn more

+ add another resource

JavaScript

About JavaScript Preprocessors

JavaScript preprocessors can help make authoring JavaScript easier and more convenient.

Learn more · Versions

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.

Powered by Algolia
About External Resources

You can apply a script from anywhere on the web to your Pen. Just put a URL to it here and we'll add it, in the order you have them, before the JavaScript in the Pen itself.

If the script you link to has the file extension of a preprocessor, we'll attempt to process it before applying.

You can also link to another Pen here, and we'll pull the JavaScript from that Pen and include it. If it's using a matching preprocessor, we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.

Learn more

+ 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.

Powered by Algolia
About Packages

Using packages here is powered by Skypack, which makes packages from npm not only available on a CDN, but prepares them for native JavaScript ES6 import usage.

All packages are different, so refer to their docs for how they work.

If you're using React / ReactDOM, make sure to turn on Babel for the JSX processing.

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="glyph">
   <svg class="icon"><use xlink:href="#email"></use></svg>
  </div>
<div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#user"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#smartphone"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#placeholder"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#group"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#internet"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#clock"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#pencil"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#computer"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#mail"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#padlock"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#phone-book"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#clock-1"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#gamepad"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#airplane"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#speech-bubble"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#heart"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#document"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#user-1"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#list"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#shield"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#share"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#notification"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#cursor"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#earth-globe"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#settings"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#phone-book-1"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#speech-bubble-1"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#picture"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#download"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#link"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#folder"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#shield-1"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#light-bulb"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#zoom-in"></use>
                  </svg>
              </div>
                                <div class="glyph">
                    <svg class="icon">
                      <use xlink:href="#volume"></use>
                  </svg>
              </div>

<svg xmlns="http://www.w3.org/2000/svg" style="display: none;"><symbol id="email" viewBox="0 0 299.997 299.997"><title>email</title><path d="M149.996,0C67.157,0,0.001,67.158,0.001,149.997c0,82.837,67.156,150,149.995,150s150-67.163,150-150 C299.996,67.158,232.835,0,149.996,0z M149.999,52.686l88.763,55.35H61.236L149.999,52.686z M239.868,196.423h-0.009 c0,8.878-7.195,16.072-16.072,16.072H76.211c-8.878,0-16.072-7.195-16.072-16.072v-84.865c0-0.939,0.096-1.852,0.252-2.749 l84.808,52.883c0.104,0.065,0.215,0.109,0.322,0.169c0.112,0.062,0.226,0.122,0.34,0.179c0.599,0.309,1.216,0.558,1.847,0.721 c0.065,0.018,0.13,0.026,0.195,0.041c0.692,0.163,1.393,0.265,2.093,0.265h0.005c0.005,0,0.01,0,0.01,0 c0.7,0,1.401-0.099,2.093-0.265c0.065-0.016,0.13-0.023,0.195-0.041c0.63-0.163,1.245-0.412,1.847-0.721 c0.114-0.057,0.228-0.117,0.34-0.179c0.106-0.06,0.218-0.104,0.322-0.169l84.808-52.883c0.156,0.897,0.252,1.808,0.252,2.749 V196.423z"/></symbol><symbol id="user" viewBox="0 0 299.997 299.997"><title>user</title><path d="M149.996,0C67.157,0,0.001,67.158,0.001,149.997c0,82.837,67.156,150,149.995,150s150-67.163,150-150 C299.996,67.156,232.835,0,149.996,0z M150.453,220.763v-0.002h-0.916H85.465c0-46.856,41.152-46.845,50.284-59.097l1.045-5.587 c-12.83-6.502-21.887-22.178-21.887-40.512c0-24.154,15.712-43.738,35.089-43.738c19.377,0,35.089,19.584,35.089,43.738 c0,18.178-8.896,33.756-21.555,40.361l1.19,6.349c10.019,11.658,49.802,12.418,49.802,58.488H150.453z"/></symbol><symbol id="smartphone" viewBox="0 0 300 300"><title>smartphone</title><circle cx="150.001" cy="226.085" r="11.718"/><path d="M182.691,68.248h-65.382c-3.665,0-6.647,2.843-6.647,6.331v123.592c0,3.491,2.98,6.331,6.647,6.331h65.382 c3.665,0,6.647-2.843,6.647-6.331V74.579C189.336,71.088,186.356,68.248,182.691,68.248z"/><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997S67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M208.354,224.021c0,11.458-9.29,20.749-20.749,20.749h-75.214c-11.458,0-20.749-9.29-20.749-20.749V75.323 c0-11.458,9.29-20.749,20.749-20.749h75.214c11.458,0,20.749,9.29,20.749,20.749V224.021z"/></symbol><symbol id="placeholder" viewBox="0 0 299.997 299.997"><title>placeholder</title><circle cx="150.437" cy="110.572" r="24.149"/><path d="M149.996,0C67.157,0,0.001,67.158,0.001,149.997c0,82.837,67.156,150,149.995,150s150-67.163,150-150 C299.996,67.158,232.835,0,149.996,0z M149.685,68.678c0.106,0,0.21-0.005,0.314-0.01c0.104,0.005,0.207,0.01,0.314,0.01 c25.274,0.399,45.834,21.288,45.834,46.568c0,30.908-33.024,62.205-46.148,73.419c-0.877-0.75-1.849-1.595-2.889-2.521 c-0.018-0.016-0.034-0.029-0.049-0.044c-14.524-12.906-43.209-42.045-43.209-70.854 C103.851,89.966,124.413,69.078,149.685,68.678z M150.65,232.25c-27.663,0-55.669-7.936-55.669-23.098 c0-10.641,13.79-17.717,31.569-20.995c3.439,3.457,6.694,6.505,9.55,9.049c-19.366,2.163-30.744,8.294-30.744,11.943 c0,4.484,17.195,12.724,45.294,12.724c28.099,0,45.297-8.24,45.297-12.724c0-3.724-11.858-10.009-31.927-12.052 c2.881-2.573,6.162-5.649,9.627-9.142c18.313,3.188,32.674,10.335,32.674,21.197C206.321,224.314,178.315,232.25,150.65,232.25z"/></symbol><symbol id="group" viewBox="0 0 299.998 299.998"><title>group</title><path d="M149.997,0C67.157,0,0.001,67.158,0.001,149.995s67.156,150.003,149.995,150.003s150-67.163,150-150.003 S232.836,0,149.997,0z M40.732,206.496c0-46.858,41.152-46.848,50.284-59.1l1.045-5.587c-12.83-6.505-21.887-22.178-21.887-40.514 c0-24.154,15.712-43.738,35.089-43.738c15.258,0,28.205,12.164,33.037,29.118c-19.41,6.168-33.768,27.214-33.768,52.232 c0,17.224,6.79,33.06,17.937,43.121c-1.79,0.918-3.781,1.854-5.493,2.656c-8.989,4.217-21.449,10.079-30.438,21.812H40.732z M150.453,244.105v-0.002h-0.916H85.466c0-46.856,41.152-46.843,50.284-59.095l1.045-5.587 c-12.83-6.505-21.887-22.178-21.887-40.514c0-24.154,15.712-43.738,35.089-43.738c19.377,0,35.089,19.584,35.089,43.738 c0,18.178-8.896,33.758-21.555,40.361l1.19,6.352c10.019,11.658,49.802,12.418,49.802,58.485H150.453z M213.452,206.498v-0.002h0 c-8.992-11.731-21.452-17.592-30.441-21.809c-1.769-0.83-3.73-1.751-5.483-2.651c11.137-10.074,17.935-25.944,17.935-43.129 c0-25.015-14.353-46.057-33.758-52.227c4.829-16.957,17.776-29.121,33.037-29.121c19.379,0,35.089,19.584,35.089,43.738 c0,18.178-8.896,33.756-21.555,40.361l1.19,6.352c10.019,11.656,49.802,12.415,49.802,58.488H213.452z"/></symbol><symbol id="internet" viewBox="0 0 300 300"><title>internet</title><path d="M202.105,96.266c-5.574-5.405-11.98-9.957-19.011-13.437c3.395,5.159,6.383,11.129,8.867,17.787 C195.528,99.337,198.918,97.882,202.105,96.266z"/><path d="M112.603,144.813h32.207v-27.29c-9.625-0.418-18.931-1.774-27.601-3.989 C114.613,123.016,112.987,133.634,112.603,144.813z"/><path d="M116.579,183.953c8.862-2.324,18.394-3.758,28.231-4.194v-24.572h-32.205 C112.964,165.39,114.359,175.121,116.579,183.953z"/><path d="M120.412,103.666c7.648,1.904,15.87,3.079,24.398,3.47V75.3c-1.502,0.104-2.988,0.252-4.464,0.444 C132.374,80.578,125.392,90.555,120.412,103.666z"/><path d="M96.922,202.79c6.686,6.72,14.636,12.174,23.456,15.989c-4.272-6.095-7.939-13.456-10.841-21.799 C105.009,198.65,100.782,200.593,96.922,202.79z"/><path d="M120.288,81.26c-8.019,3.481-15.307,8.325-21.586,14.239c3.613,1.937,7.521,3.639,11.656,5.125 C113.098,93.276,116.452,86.761,120.288,81.26z"/><path d="M107.195,110.479c-5.638-2.002-10.906-4.396-15.707-7.158c-9.231,11.547-15.113,25.866-16.189,41.492h26.914 C102.594,132.454,104.343,120.861,107.195,110.479z"/><path d="M102.216,155.187H75.3c1.017,14.791,6.328,28.423,14.721,39.627c4.995-3.001,10.551-5.61,16.542-7.773 C104.094,177.305,102.574,166.573,102.216,155.187z"/><path d="M140.536,224.283c1.413,0.176,2.837,0.319,4.274,0.418v-34.554c-8.831,0.415-17.359,1.681-25.262,3.719 C124.604,208.249,132.008,219.207,140.536,224.283z"/><path d="M195.766,187c5.335,1.932,10.338,4.212,14.913,6.837c7.98-11.018,13.033-24.279,14.021-38.647h-24.595 C199.748,166.557,198.233,177.277,195.766,187z"/><path d="M183.011,217.213c7.82-3.857,14.864-9.039,20.858-15.25c-3.439-1.849-7.156-3.507-11.095-4.954 C190.115,204.636,186.821,211.445,183.011,217.213z"/><path d="M149.997,0C67.158,0,0.003,67.161,0.003,149.997S67.158,300,149.997,300s150-67.163,150-150.003S232.837,0,149.997,0z M150,240.462c-49.88,0-90.462-40.579-90.462-90.462S100.12,59.538,150,59.538s90.462,40.579,90.462,90.462 S199.88,240.462,150,240.462z"/><path d="M162.719,76.202c-2.474-0.425-4.987-0.726-7.534-0.903v31.937c9.334-0.275,18.352-1.512,26.711-3.597 C177.074,90.952,170.375,81.195,162.719,76.202z"/><path d="M195.121,110.471c2.856,10.382,4.604,21.981,4.985,34.342h24.592c-1.045-15.227-6.658-29.209-15.484-40.595 C204.854,106.596,200.139,108.692,195.121,110.471z"/><path d="M155.185,224.7c2.49-0.169,4.949-0.464,7.368-0.871c8.201-5.262,15.307-16.002,20.212-29.948 c-8.613-2.223-17.955-3.543-27.58-3.833V224.7z"/><path d="M185.102,113.508c-9.384,2.402-19.493,3.813-29.917,4.103v27.202h34.534 C189.332,133.627,187.703,122.998,185.102,113.508z"/><path d="M189.716,155.187h-34.531v24.486c10.732,0.288,21.052,1.722,30.573,4.207C187.97,175.07,189.358,165.364,189.716,155.187 z"/></symbol><symbol id="clock" viewBox="0 0 299.995 299.995"><title>clock</title><path d="M149.995,0C67.156,0,0,67.158,0,149.995s67.156,150,149.995,150s150-67.163,150-150S232.834,0,149.995,0z M214.842,178.524H151.25c-0.215,0-0.415-0.052-0.628-0.06c-0.213,0.01-0.412,0.06-0.628,0.06 c-5.729,0-10.374-4.645-10.374-10.374V62.249c0-5.729,4.645-10.374,10.374-10.374s10.374,4.645,10.374,10.374v95.527h54.47 c5.729,0,10.374,4.645,10.374,10.374C225.212,173.879,220.571,178.524,214.842,178.524z"/></symbol><symbol id="pencil" viewBox="0 0 300 300"><title>pencil</title><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997S67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M221.302,107.945l-14.247,14.247l-29.001-28.999l-11.002,11.002l29.001,29.001l-71.132,71.126 l-28.999-28.996L84.92,186.328l28.999,28.999l-7.088,7.088l-0.135-0.135c-0.786,1.294-2.064,2.238-3.582,2.575l-27.043,6.03 c-0.405,0.091-0.817,0.135-1.224,0.135c-1.476,0-2.91-0.581-3.973-1.647c-1.364-1.359-1.932-3.322-1.512-5.203l6.027-27.035 c0.34-1.517,1.286-2.798,2.578-3.582l-0.137-0.137L192.3,78.941c1.678-1.675,4.404-1.675,6.082,0.005l22.922,22.917 C222.982,103.541,222.982,106.267,221.302,107.945z"/></symbol><symbol id="computer" viewBox="0 0 300 300"><title>computer</title><path d="M221.755,89.414H78.242c-1.432,0-2.594,1.162-2.594,2.594v95.963c0,1.432,1.162,2.594,2.594,2.594h143.513 c1.432,0,2.594-1.162,2.594-2.594V92.007C224.349,90.576,223.187,89.414,221.755,89.414z"/><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997S67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M242.504,187.97c0,11.458-9.29,20.749-20.749,20.749h-47.144v11.588h23.801 c4.298,0,7.781,3.483,7.781,7.781c0,4.298-3.483,7.781-7.781,7.781h-96.826c-4.298,0-7.781-3.483-7.781-7.781 c0-4.298,3.483-7.781,7.781-7.781h23.801v-11.588H78.242c-11.458,0-20.749-9.29-20.749-20.749V92.007 c0-11.458,9.29-20.749,20.749-20.749h143.513c11.458,0,20.749,9.29,20.749,20.749V187.97z"/></symbol><symbol id="mail" viewBox="0 0 299.997 299.997"><title>mail</title><path d="M149.996,0C67.157,0,0.001,67.158,0.001,149.997c0,82.837,67.156,150,149.995,150s150-67.163,150-150 C299.996,67.158,232.835,0,149.996,0z M145.294,100.159h111.864c0.763,0,1.502,0.091,2.225,0.223l-62.648,36.017l-52.964-36.087 C144.275,100.25,144.77,100.159,145.294,100.159z M60.572,185.31v-15.558h49.921l-0.609,5.047l-0.112,0.931v0.936 c0,3.019,0.501,5.921,1.398,8.644H60.572z M112.293,154.842h-68.58V139.28h70.465L112.293,154.842z M117.571,111.218l-0.965,7.965 H28.585v-15.562h90.384C118.17,106.028,117.677,108.573,117.571,111.218z M249.375,188.852H137.513 c-3.348,0-6.378-1.351-8.58-3.538c0,0,0,0,0-0.003c-0.539-0.537-1.027-1.128-1.46-1.758c-0.01-0.016-0.029-0.031-0.039-0.047 c-0.402-0.594-0.737-1.232-1.032-1.891c-0.029-0.065-0.073-0.122-0.104-0.189c-0.265-0.622-0.451-1.284-0.609-1.956 c-0.029-0.117-0.083-0.223-0.106-0.34c-0.163-0.799-0.249-1.621-0.249-2.464l4.145-34.259l0.379-3.13l3.258-26.94 c0-0.77,0.093-1.515,0.231-2.243c0.016-0.078,0.008-0.163,0.026-0.241c0.01,0.005,0.018,0.013,0.029,0.021 c0.35-1.662,1.012-3.206,1.958-4.547v5.88l57.741,39.132c0.078,0.054,0.163,0.083,0.244,0.13c0.083,0.052,0.169,0.093,0.257,0.14 c0.456,0.233,0.923,0.42,1.401,0.545c0.052,0.013,0.099,0.021,0.15,0.031c0.524,0.124,1.056,0.2,1.582,0.2h0.005 c0.005,0,0.008,0,0.01,0c0.527,0,1.058-0.075,1.582-0.2c0.052-0.01,0.099-0.018,0.15-0.031c0.477-0.124,0.944-0.311,1.401-0.545 c0.086-0.047,0.171-0.088,0.257-0.14c0.08-0.047,0.163-0.075,0.244-0.13l68.792-39.716c0.08,0.565,0.171,1.128,0.171,1.717 l-7.781,64.329C261.559,183.4,256.105,188.852,249.375,188.852z"/></symbol><symbol id="padlock" viewBox="0 0 299.995 299.995"><title>padlock</title><path d="M149.997,161.485c-8.613,0-15.598,6.982-15.598,15.598c0,5.776,3.149,10.807,7.817,13.505v17.341h15.562v-17.341 c4.668-2.697,7.817-7.729,7.817-13.505C165.595,168.467,158.611,161.485,149.997,161.485z"/><path d="M150.003,85.849c-13.111,0-23.775,10.665-23.775,23.775v25.319h47.548v-25.319 C173.775,96.516,163.111,85.849,150.003,85.849z"/><path d="M149.995,0.001C67.156,0.001,0,67.159,0,149.998c0,82.837,67.156,149.997,149.995,149.997s150-67.161,150-149.997 C299.995,67.159,232.834,0.001,149.995,0.001z M196.085,227.118h-92.173c-9.734,0-17.626-7.892-17.626-17.629v-56.919 c0-8.491,6.007-15.582,14.003-17.25v-25.697c0-27.409,22.3-49.711,49.711-49.711c27.409,0,49.709,22.3,49.709,49.711v25.697 c7.993,1.673,14,8.759,14,17.25v56.919h0.002C213.711,219.225,205.819,227.118,196.085,227.118z"/></symbol><symbol id="phone-book" viewBox="0 0 299.995 299.995"><title>phone-book</title><path d="M149.992,0.001C67.156,0.001,0,67.159,0,149.998c0,82.837,67.156,149.997,149.992,149.997 c82.842,0,150.003-67.161,150.003-149.997C299.995,67.159,232.834,0.001,149.992,0.001z M210.947,217.132v10.374 c0,5.729-4.645,10.374-10.374,10.374h-10.374h-57.256H96.829c-11.458,0-20.749-9.29-20.749-20.749V86.592 c0-11.458,9.29-20.749,20.749-20.749h36.113h57.256h10.374c5.729,0,10.374,4.645,10.374,10.374v10.375h0.001V217.132z M231.695,86.592v130.54v10.374c0,5.729-4.645,10.374-10.374,10.374h-2.806c1.774-3.055,2.806-6.593,2.806-10.374v-10.374V86.592 V76.219c0-3.781-1.032-7.319-2.806-10.374h2.806c5.729,0,10.374,4.645,10.374,10.374V86.592z"/><path d="M175.591,165.517c0,0-3.909-4.692-8.237-1.455c-3.226,2.412-9.023,7.776-10.416,9.078c0,0-9.69-5.166-15.424-9.884 c-8.494-6.985-14.174-15.608-17.151-20.513l-2.223-4.191c0.775-0.835,6.71-7.189,9.277-10.639 c3.232-4.326-1.452-8.235-1.452-8.235s-13.183-13.183-16.184-15.798c-3.003-2.622-6.461-1.167-6.461-1.167 c-6.315,4.082-12.859,7.628-13.248,24.686c-0.013,15.969,12.109,32.438,25.215,45.188c13.131,14.402,31.162,28.833,48.588,28.817 c17.055-0.384,20.598-6.93,24.678-13.245c0,0,1.46-3.455-1.159-6.458C188.774,178.693,175.591,165.517,175.591,165.517z"/></symbol><symbol id="clock-1" viewBox="0 0 299.998 299.998"><title>clock-1</title><path d="M149.997,0C67.157,0,0.001,67.158,0.001,149.995s67.156,150.003,149.995,150.003s150-67.163,150-150.003 S232.836,0,149.997,0z M160.355,168.337c-0.008,0.394-0.067,0.788-0.122,1.183c-0.039,0.296-0.057,0.599-0.124,0.89 c-0.067,0.303-0.182,0.602-0.28,0.905c-0.117,0.366-0.226,0.731-0.379,1.076c-0.029,0.06-0.039,0.124-0.065,0.184 c-0.226,0.482-0.488,0.934-0.775,1.362c-0.018,0.026-0.042,0.052-0.06,0.078c-0.327,0.48-0.7,0.916-1.092,1.325 c-0.109,0.112-0.22,0.213-0.335,0.319c-0.345,0.329-0.708,0.63-1.094,0.905c-0.119,0.086-0.233,0.176-0.358,0.259 c-0.495,0.324-1.014,0.609-1.554,0.843c-0.117,0.052-0.239,0.083-0.358,0.13c-0.456,0.176-0.918,0.322-1.395,0.433 c-0.171,0.041-0.34,0.078-0.514,0.109c-0.612,0.112-1.232,0.189-1.86,0.189c-0.127,0-0.257-0.039-0.384-0.044 c-0.602-0.023-1.198-0.07-1.771-0.192c-0.179-0.039-0.355-0.117-0.534-0.166c-0.534-0.145-1.056-0.306-1.554-0.529 c-0.057-0.029-0.117-0.034-0.174-0.06l-57.515-27.129c-5.182-2.443-7.402-8.626-4.959-13.808 c2.443-5.179,8.626-7.402,13.808-4.959l42.716,20.144V62.249c0-5.729,4.645-10.374,10.374-10.374s10.374,4.645,10.374,10.374 V168.15h0.002C160.373,168.212,160.355,168.274,160.355,168.337z"/></symbol><symbol id="gamepad" viewBox="0 0 300 300"><title>gamepad</title><circle cx="192.147" cy="134.719" r="8.808"/><circle cx="206.357" cy="120.516" r="8.808"/><polygon points="94.61,117.808 81.642,117.808 81.642,130.128 69.323,130.128 69.323,143.096 81.642,143.096 81.642,155.415 94.61,155.415 94.61,143.096 106.93,143.096 106.93,130.128 94.61,130.128 "/><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997S67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M227.064,216.092h-13.279l-28.61-45.637h-31.46h-7.431h-31.46l-28.612,45.637H72.933 c-10.468,0-18.957-8.486-18.957-18.957l4.212-66.349c0-0.213,0.026-0.379,0.031-0.578c-0.003-0.213-0.031-0.418-0.031-0.633 c0-22.403,18.163-40.566,40.566-40.566c9.288,0,15.717,3.156,22.554,8.411c8.751-2.539,13.105-4.728,24.974-5.382h7.431 c11.868,0.654,16.223,2.843,24.974,5.382c6.839-5.255,13.266-8.411,22.554-8.411c22.403,0,40.566,18.163,40.566,40.566 c0,0.215-0.029,0.42-0.031,0.633c0.005,0.197,0.031,0.366,0.031,0.578l4.212,66.349 C246.018,207.606,237.535,216.092,227.064,216.092z"/><circle cx="220.565" cy="134.721" r="8.808"/><circle cx="206.355" cy="148.931" r="8.808"/></symbol><symbol id="airplane" viewBox="0 0 300 300"><title>airplane</title><path d="M149.997,0C67.158,0,0.003,67.161,0.003,149.997S67.158,300,149.997,300s150-67.163,150-150.003S232.837,0,149.997,0z M222.978,99.461l-32.435,30.711l20.562,82.844l-12.27,12.27l-39.262-64.028l-0.905-0.905l-40.385,38.24 c-0.228,0.231-0.485,0.405-0.718,0.622l-1.297,29.481l-44.965-44.962l29.471-1.294c0.218-0.239,0.394-0.493,0.625-0.724 l38.24-40.387L139.314,141l-64.601-39.832l12.27-12.27l82.471,20.946l31.079-32.827c6.201-6.201,16.251-6.199,22.447,0 C229.177,83.215,229.177,93.263,222.978,99.461z"/></symbol><symbol id="speech-bubble" viewBox="0 0 299.99 299.99"><title>speech-bubble</title><path d="M149.995,0C67.158,0,0,67.156,0,149.995S67.158,299.99,149.995,299.99c82.839,0,149.995-67.156,149.995-149.995 S232.834,0,149.995,0z M89.481,211.219l-37.176,9.959l10.177-37.973c-7.01-12.05-11.051-26.05-11.051-40.997 c0-45.074,36.541-81.618,81.62-81.618c45.071,0,81.615,36.544,81.615,81.618c0,45.074-36.544,81.62-81.615,81.62 C117.023,223.832,102.091,219.199,89.481,211.219z M247.76,236.976l-33.818-9.059c-11.477,7.257-25.057,11.474-39.63,11.474 c-10.39,0-20.271-2.142-29.248-5.999c45.064-5.9,79.981-44.527,79.981-91.177c0-13.518-2.959-26.351-8.216-37.926 c19.182,13.427,31.73,35.67,31.73,60.853c0,13.596-3.673,26.33-10.05,37.293L247.76,236.976z"/></symbol><symbol id="heart" viewBox="0 0 299.995 299.995"><title>heart</title><path d="M165.45,108.207l-9.788,9.786c-1.945,1.943-4.658,2.638-7.158,2.101c-1.541-0.241-3.009-0.936-4.173-2.103l-9.783-9.783 c-6.549-6.546-15.149-9.822-23.749-9.822c-8.6,0-17.201,3.273-23.749,9.822c-12.82,12.823-12.698,33.374,0.283,47.805 c13.232,14.708,49.605,45.027,62.666,55.788c13.061-10.758,49.442-41.085,62.677-55.788c12.978-14.428,13.1-34.982,0.28-47.805 C199.859,95.115,178.55,95.112,165.45,108.207z"/><path d="M149.995,0C67.156,0,0,67.158,0,149.995s67.156,150,149.995,150s150-67.163,150-150S232.834,0,149.995,0z M224.239,166.417c-16.98,18.866-67.049,59.619-69.174,61.343c-1.489,1.211-3.286,1.826-5.07,1.74 c-0.054,0.003-0.112,0.003-0.169,0.003c-1.725,0-3.46-0.571-4.902-1.743c-2.124-1.725-52.188-42.478-69.163-61.341 c-18.612-20.689-18.49-50.445,0.283-69.218c19.161-19.164,50.344-19.164,69.506,0l4.448,4.448l4.451-4.451 c19.161-19.161,50.341-19.159,69.508,0C242.726,115.975,242.848,145.731,224.239,166.417z"/></symbol><symbol id="document" viewBox="0 0 299.994 299.994"><title>document</title><rect x="87.751" y="180.456" width="93.369" height="10.374"/><rect x="87.751" y="157.444" width="93.369" height="10.374"/><rect x="87.751" y="134.433" width="93.369" height="10.374"/><rect x="87.751" y="204.792" width="93.369" height="10.374"/><path d="M149.997,0C67.156,0,0,67.156,0,149.997s67.156,149.997,149.997,149.997s149.997-67.156,149.997-149.997 S232.839,0,149.997,0z M201.641,211.953v18.225c0,10.066-8.159,18.225-18.22,18.225H85.453c-10.066,0-18.225-8.159-18.225-18.225 V95.763c0-10.066,8.157-18.225,18.225-18.225h97.967c10.066,0,18.223,8.159,18.22,18.228c0.001,0,0.001,18.222,0.001,18.222 V211.953z M224.986,188.61v18.217c0,8.237-5.467,15.193-12.971,17.45v-12.325v-97.967V95.763 c0-15.769-12.828-28.599-28.594-28.599H91.349c2.259-7.503,9.21-12.971,17.45-12.971h97.967c10.061,0,18.22,8.162,18.217,18.228 v18.223h0.003V188.61z"/><rect x="87.751" y="111.418" width="93.369" height="10.374"/></symbol><symbol id="user-1" viewBox="0 0 299.997 299.997"><title>user-1</title><path d="M149.996,0C67.157,0,0.001,67.158,0.001,149.997c0,82.837,67.156,150,149.995,150s150-67.163,150-150 C299.996,67.156,232.835,0,149.996,0z M149.996,59.147c25.031,0,45.326,20.292,45.326,45.325 c0,25.036-20.292,45.328-45.326,45.328s-45.325-20.292-45.325-45.328C104.671,79.439,124.965,59.147,149.996,59.147z M168.692,212.557h-0.001v16.41v2.028h-18.264h-0.864H83.86c0-44.674,24.302-60.571,40.245-74.843 c7.724,4.15,16.532,6.531,25.892,6.601c9.358-0.07,18.168-2.451,25.887-6.601c7.143,6.393,15.953,13.121,23.511,22.606h-7.275 v10.374v13.051h-13.054h-10.374V212.557z M218.902,228.967v23.425h-16.41v-23.425h-23.428v-16.41h23.428v-23.425H218.9v23.425 h23.423v16.41H218.902z"/></symbol><symbol id="list" viewBox="0 0 300 300"><title>list</title><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997C0.001,232.837,67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M90.318,204.463c-5.727,0-10.361-4.635-10.361-10.364c0-5.724,4.635-10.359,10.361-10.359 c5.724,0,10.361,4.635,10.361,10.359C100.679,199.828,96.042,204.463,90.318,204.463z M90.318,160.361 c-5.727,0-10.361-4.635-10.361-10.367c0-5.724,4.635-10.359,10.361-10.359c5.724,0,10.361,4.635,10.361,10.359 C100.679,155.727,96.042,160.361,90.318,160.361z M90.318,116.26c-5.727,0-10.361-4.635-10.361-10.364 c0-5.724,4.635-10.359,10.361-10.359c5.724,0,10.361,4.635,10.361,10.359C100.679,111.625,96.042,116.26,90.318,116.26z M220.044,203.814h-97.143c-5.729,0-10.374-4.645-10.374-10.374s4.645-10.374,10.374-10.374h97.143 c5.729,0,10.374,4.645,10.374,10.374S225.773,203.814,220.044,203.814z M220.044,160.048h-97.143 c-5.729,0-10.374-4.645-10.374-10.374s4.645-10.374,10.374-10.374h97.143c5.729,0,10.374,4.645,10.374,10.374 C230.418,155.402,225.773,160.048,220.044,160.048z M220.044,116.281h-97.143c-5.729,0-10.374-4.645-10.374-10.374 s4.645-10.374,10.374-10.374h97.143c5.729,0,10.374,4.645,10.374,10.374S225.773,116.281,220.044,116.281z"/></symbol><symbol id="shield" viewBox="0 0 300 300"><title>shield</title><polygon points="121.631,143.635 107.992,155.633 140.718,192.109 140.782,192.045 140.826,192.109 199.514,132.467 189.039,118.698 141.34,157.952 "/><path d="M149.997,0C67.158,0,0.003,67.161,0.003,149.997S67.158,300,149.997,300s150-67.163,150-150.003S232.837,0,149.997,0z M150,232.886c-77.185,0-82.683-130.592-82.683-130.592l82.681-35.187H150l82.681,35.187 C232.681,102.294,227.183,232.886,150,232.886z"/></symbol><symbol id="share" viewBox="0 0 300 300"><title>share</title><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997S67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M133.314,149.997c0,3.133-0.571,6.111-1.569,8.901l41.868,20.142c4.819-5.275,11.731-8.595,19.436-8.595 c14.553,0,26.353,11.796,26.353,26.348c0,14.555-11.803,26.356-26.359,26.356c-14.553,0-26.359-11.801-26.359-26.356 c0-1.395,0.145-2.757,0.353-4.09l-44.568-21.436c-4.357,3.188-9.71,5.089-15.52,5.089c-14.555,0-26.356-11.796-26.356-26.361 c0-14.55,11.801-26.348,26.356-26.348c5.81,0,11.165,1.901,15.523,5.086l44.571-21.431c-0.21-1.336-0.353-2.692-0.353-4.09 c0-14.558,11.803-26.356,26.359-26.356c14.553,0,26.356,11.798,26.356,26.356c0,14.555-11.803,26.356-26.356,26.356 c-7.7,0-14.617-3.328-19.436-8.598l-41.868,20.134C132.744,143.89,133.314,146.875,133.314,149.997z"/></symbol><symbol id="notification" viewBox="0 0 300 300"><title>notification</title><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997S67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M149.999,232.951c-10.766,0-19.499-8.725-19.499-19.499h38.995 C169.497,224.226,160.765,232.951,149.999,232.951z M215.889,193.9h-0.005v-0.001c0,7.21-5.843,7.685-13.048,7.685H97.16 c-7.208,0-13.046-0.475-13.046-7.685v-1.242c0-5.185,3.045-9.625,7.42-11.731l4.142-35.753c0-26.174,18.51-48.02,43.152-53.174 v-13.88c0-6.17,5.003-11.173,11.176-11.173c6.17,0,11.173,5.003,11.173,11.173V92c24.642,5.153,43.152,26.997,43.152,53.174 l4.142,35.758c4.375,2.109,7.418,6.541,7.418,11.726V193.9z"/></symbol><symbol id="cursor" viewBox="0 0 300 300"><title>cursor</title><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997S67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M208.8,94.181l-38.097,107.473c-0.322,0.908-1.118,1.561-2.067,1.699c-0.967,0.132-1.904-0.259-2.469-1.032 l-19.346-26.434l-31.981,31.979c-0.506,0.506-1.17,0.76-1.834,0.76s-1.328-0.254-1.834-0.76L91.806,188.5 c-1.014-1.014-1.014-2.653,0-3.667l31.979-31.984l-26.436-19.343c-0.775-0.568-1.175-1.517-1.035-2.469 c0.14-0.952,0.794-1.748,1.699-2.067l107.473-38.097c0.944-0.335,1.994-0.099,2.7,0.609 C208.896,92.186,209.135,93.237,208.8,94.181z"/></symbol><symbol id="earth-globe" viewBox="0 0 300 300"><title>earth-globe</title><path d="M204.572,164.656c1.678,6.632-16.682,4.528-21.166,10.737c-4.487,6.206-15.45,2.036-17.992,0.843 s-12.278,2.783-11.427-3.976c0.846-6.761,6.769-7.158,13.121-9.941c6.349-2.78,15.507-12.024,11.007-13.232 c-21.187-5.683-28.415-25.586-28.415-25.586c-1.271-0.239-0.952-14.07-6.453-14.467c-5.506-0.399-8.471,1.59-16.511,0 c-8.045-1.59-6.349-6.759-7.62-17.893c-1.268-11.134,3.39-7.555,5.906-11.132c0.22-0.314,0.506-0.594,0.786-0.874 C96.35,89.221,75.103,117.17,75.103,150.002c0,0.052,0.003,0.104,0.003,0.156c5.475,0.353,15.445,1.509,15.914,5.265 c0.648,5.187,0,11.671,4.539,13.616s5.836-7.781,9.726-5.187c3.89,2.594,14.265,5.091,14.265,9.677c0,4.585-1.945,11.72,0,13.017 s9.721,10.374,9.723,11.671c0.003,1.297,2.741,7.892,1.924,10.413c-0.677,2.09-4.093,8.58-7.405,11.531 c8.162,3.058,16.991,4.741,26.208,4.741c41.3,0,74.9-33.6,74.9-74.9c0-12.231-2.967-23.778-8.188-33.986 c0.501,7.617,0.163,14.558,1.831,16.832C225.842,142.787,200.762,149.624,204.572,164.656z"/><path d="M149.997,0C67.158,0,0.003,67.161,0.003,149.997S67.158,300,149.997,300s150-67.163,150-150.003S232.837,0,149.997,0z M150,240.462c-49.88,0-90.462-40.579-90.462-90.462S100.12,59.538,150,59.538s90.462,40.579,90.462,90.462 S199.88,240.462,150,240.462z"/></symbol><symbol id="settings" viewBox="0 0 300 300"><title>settings</title><circle cx="149.996" cy="156.072" r="28.197"/><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997S67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M228.82,171.799l-21.306,1.372c-1.193,4.02-2.783,7.866-4.746,11.482l14.088,16.039l-22.245,22.243 l-16.031-14.091c-3.618,1.961-7.464,3.551-11.482,4.741l-1.377,21.311l-31.458-0.003l-1.375-21.309 c-4.015-1.19-7.861-2.78-11.479-4.741l-16.034,14.091l-22.243-22.25l14.088-16.031c-1.963-3.618-3.553-7.464-4.746-11.482 l-21.306-1.375v-31.458l21.306-1.375c1.193-4.015,2.786-7.864,4.746-11.479l-14.088-16.031l22.245-22.248l16.031,14.088 c3.618-1.963,7.464-3.551,11.484-4.744l1.375-21.309h31.452l1.377,21.309c4.017,1.193,7.864,2.78,11.482,4.744l16.036-14.088 l22.243,22.248l-14.088,16.031c1.961,3.618,3.553,7.464,4.746,11.479l21.306,1.375L228.82,171.799z"/></symbol><symbol id="phone-book-1" viewBox="0 0 299.995 299.995"><title>phone-book-1</title><path d="M143.511,154.004c19.146,0,23.718-15.613,23.718-28.711c0-13.098-10.621-23.718-23.718-23.718 c-13.097,0-23.721,10.621-23.721,23.718C119.79,138.391,126.082,154.004,143.511,154.004z"/><path d="M146.815,157.301h-3.304h-3.304c-13.002,0-32.498,11.91-32.498,26.61c0,14.7-4.409,26.615,8.59,26.615h27.214h27.214 c12.999,0,8.59-11.915,8.59-26.615S159.817,157.301,146.815,157.301z"/><path d="M149.992,0.001C67.156,0.001,0,67.159,0,149.998s67.156,149.997,149.992,149.997 c82.842,0,150.003-67.161,150.003-149.997C299.995,67.157,232.834,0.001,149.992,0.001z M210.947,217.132v10.374 c0,5.729-4.645,10.374-10.374,10.374h-10.374h-57.256H96.829c-11.458,0-20.749-9.29-20.749-20.749V86.589 c0-11.458,9.29-20.749,20.749-20.749h36.113h57.256h10.374c5.729,0,10.374,4.645,10.374,10.374v10.375h0.001V217.132z M231.695,86.589v130.543v10.374c0,5.729-4.645,10.374-10.374,10.374h-2.806c1.774-3.058,2.806-6.593,2.806-10.374v-10.374 V86.589V76.215c0-3.781-1.032-7.319-2.806-10.374h2.806c5.729,0,10.374,4.645,10.374,10.374V86.589z"/></symbol><symbol id="speech-bubble-1" viewBox="0 0 299.99 299.99"><title>speech-bubble-1</title><path d="M149.995,0C67.156,0,0,67.158,0,149.995S67.156,299.99,149.995,299.99c82.837,0,149.995-67.158,149.995-149.995 S232.831,0,149.995,0z M149.995,234.281c-17.709,0-34.292-4.16-48.573-11.383c-3.826,3.063-21.135,15.764-38.31,9.822 c10.382-9.832,12.275-21.301,12.024-29.269c-13.728-14.545-21.97-33.162-21.97-53.456c0.003-46.552,43.354-84.292,96.829-84.292 c53.477,0,96.829,37.739,96.829,84.292C246.824,196.548,203.472,234.281,149.995,234.281z"/></symbol><symbol id="picture" viewBox="0 0 299.998 299.998"><title>picture</title><path d="M149.995,0.001C67.156,0.001,0,67.16,0,149.999s67.156,149.997,149.995,149.997s150.003-67.161,150.003-149.997 C299.997,67.157,232.834,0.001,149.995,0.001z M70.75,226.844c-3.981,0-7.205-3.221-7.205-7.202V80.353 c0-3.979,3.224-7.202,7.205-7.202h158.497c3.981,0,7.205,3.224,7.205,7.202v77.081h-10.795h-6.147V89.834H80.323v93.027h7.949 l32.119-50.087l21.465,33.468l10.66,16.62h9.241l-15.281-23.827l9.959-15.53l25.241,39.355h10.177v8.375v16.412v10.374h10.374 h13.053v8.824H70.75z M207.264,121.042c0,8.232-6.676,14.908-14.908,14.908s-14.908-6.676-14.908-14.908 s6.676-14.908,14.908-14.908S207.264,112.813,207.264,121.042z M242.067,207.646v23.423H225.66v-4.225v-19.198h-23.428v-16.412 h23.428v-23.423h10.795h5.613v23.423h23.425v16.412H242.067z"/></symbol><symbol id="download" viewBox="0 0 299.998 299.998"><title>download</title><path d="M149.995,0C67.156,0,0,67.159,0,149.997c0,82.837,67.156,150,149.995,150s150.003-67.163,150.003-150 C299.997,67.159,232.834,0,149.995,0z M110.967,105.357c2.075-2.075,4.793-3.112,7.511-3.112c2.718,0,5.434,1.037,7.508,3.112 l13.297,13.295v-3.911V62.477c0-5.867,4.754-10.621,10.621-10.621s10.621,4.754,10.621,10.621v52.263v4.63l4.63-4.63l9.386-9.384 c2.075-2.075,4.79-3.112,7.508-3.112s5.436,1.037,7.511,3.112c2.552,2.549,3.522,6.079,2.933,9.384 c0,0.003-0.003,0.005-0.003,0.008c-0.044,0.239-0.119,0.469-0.179,0.703c-0.091,0.366-0.189,0.729-0.322,1.084 c-0.088,0.239-0.189,0.472-0.296,0.705c-0.166,0.371-0.358,0.726-0.568,1.079c-0.112,0.187-0.215,0.373-0.34,0.552 c-0.363,0.524-0.76,1.032-1.227,1.499l-15.115,15.115l-16.591,16.591c-2.077,2.075-4.793,3.105-7.508,3.105 c-0.026,0-0.052,0-0.078,0s-0.054,0-0.078,0c-2.715,0-5.431-1.03-7.508-3.105l-16.591-16.591l-15.115-15.115 c-0.467-0.467-0.864-0.973-1.222-1.496c-0.127-0.184-0.231-0.373-0.345-0.56c-0.207-0.35-0.397-0.703-0.563-1.069 c-0.109-0.239-0.213-0.475-0.301-0.718c-0.127-0.348-0.223-0.7-0.314-1.056c-0.062-0.246-0.143-0.485-0.187-0.734 C107.444,111.436,108.412,107.906,110.967,105.357z M231.574,209.315h-0.003c0,14.337-14.057,25.568-32.005,25.568h-99.132 c-17.945,0-32.005-11.23-32.005-25.568V140.31c0-12.117,10.058-21.988,24.004-24.761c0.604,5.981,3.224,11.526,7.534,15.834 l4.108,4.108h-3.641c-7.265,0-11.256,3.621-11.256,4.819v69.005c0,1.201,3.992,4.819,11.256,4.819h99.135 c7.265,0,11.256-3.621,11.256-4.819V140.31c0-1.198-3.992-4.819-11.256-4.819h-3.12l4.111-4.111 c4.282-4.279,6.894-9.786,7.516-15.727c13.681,2.913,23.498,12.69,23.498,24.66V209.315z"/></symbol><symbol id="link" viewBox="0 0 300 300"><title>link</title><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997S67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M225.363,123.302l-36.686,36.686c-3.979,3.979-9.269,6.17-14.895,6.17c-5.625,0-10.916-2.192-14.895-6.168 l-1.437-1.437l-3.906,3.906l1.434,1.434c8.214,8.214,8.214,21.579,0,29.793l-36.681,36.686c-3.979,3.979-9.269,6.17-14.898,6.17 c-5.628,0-10.919-2.192-14.9-6.173L74.634,216.5c-8.214-8.209-8.214-21.573-0.003-29.79l36.689-36.684 c3.979-3.979,9.269-6.17,14.898-6.17s10.916,2.192,14.898,6.17l1.432,1.432l3.906-3.906l-1.432-1.432 c-8.214-8.211-8.214-21.576-0.005-29.79l36.689-36.686c3.981-3.981,9.272-6.173,14.898-6.173s10.916,2.192,14.898,6.17 l13.868,13.873C233.577,101.723,233.577,115.09,225.363,123.302z"/><path d="M142.539,173.459l-7.093,7.093l-11.002-10.999l7.093-7.093l-1.432-1.432c-1.04-1.037-2.422-1.611-3.89-1.611 c-1.471,0-2.853,0.573-3.893,1.611l-36.686,36.681c-2.145,2.147-2.145,5.638,0,7.783l13.87,13.873 c2.083,2.083,5.708,2.08,7.786,0.003l36.681-36.686c2.148-2.147,2.148-5.641,0-7.789L142.539,173.459z"/><path d="M200.493,90.643c-1.04-1.04-2.425-1.613-3.896-1.613c-1.471,0-2.856,0.573-3.896,1.616l-36.686,36.684 c-2.142,2.147-2.142,5.638,0.003,7.786l1.434,1.432l10.88-10.883l11.002,11.002l-10.88,10.883l1.434,1.434 c2.083,2.077,5.703,2.08,7.786-0.003l36.684-36.681c2.145-2.147,2.145-5.638,0-7.786L200.493,90.643z"/></symbol><symbol id="folder" viewBox="0 0 300 300"><title>folder</title><path d="M207.597,115.365h-71.22l-18.759-17.029H85.649c-2.446,0-4.435,1.989-4.435,4.432v108.899 c0,2.443,1.989,4.432,4.435,4.432h3.369l17.688-91.03h105.32v-5.27C212.027,117.357,210.038,115.365,207.597,115.365z"/><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997S67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M227.241,212.721c-0.542,10.333-8.948,18.601-19.343,18.912c-0.101,0.005-0.197,0.031-0.301,0.031 l-9.231,0.005l-112.72-0.005c-11.023,0-19.991-8.969-19.991-19.994V102.768c0-11.025,8.969-19.994,19.997-19.994h37.975 l18.759,17.029h65.211c11.023,0,19.991,8.969,19.991,19.997v5.27l17.904,0.003L227.241,212.721z"/></symbol><symbol id="shield-1" viewBox="0 0 300 300"><title>shield-1</title><path d="M150,225.105c39.749,0,58.545-40.546,67.35-75.105H150V225.105z"/><path d="M82.681,149.992H150v-74.43l-74.527,31.717C76.179,115.404,78.057,131.876,82.681,149.992z"/><path d="M149.997,0C67.158,0,0.003,67.161,0.003,149.997S67.158,300,149.997,300s150-67.163,150-150.003S232.837,0,149.997,0z M240.454,102.62c-0.236,5.636-6.774,138.046-90.454,138.046c-83.682,0-90.22-132.408-90.456-138.046l-0.226-5.379l90.68-38.593 l90.685,38.593L240.454,102.62z"/></symbol><symbol id="light-bulb" viewBox="0 0 300 300"><title>light-bulb</title><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997S67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M148.751,218.468c-12.893,0-23.342-11.082-23.342-24.764h46.685 C172.093,207.386,161.641,218.468,148.751,218.468z M170.413,180.695h-43.326c-1.167-12.753-31.476-23.871-31.476-55.747 c0-33.999,25.425-52.027,53.135-52.709h0.003c0.003,0,0.003,0,0.003,0c27.712,0.685,53.135,18.71,53.135,52.709 C201.889,156.824,171.58,167.942,170.413,180.695z"/></symbol><symbol id="zoom-in" viewBox="0 0 299.998 299.998"><title>zoom-in</title><path d="M139.414,96.193c-22.673,0-41.056,18.389-41.056,41.062c0,22.678,18.383,41.062,41.056,41.062 c22.678,0,41.059-18.383,41.059-41.062C180.474,114.582,162.094,96.193,139.414,96.193z M159.255,146.971h-12.06v12.06 c0,4.298-3.483,7.781-7.781,7.781c-4.298,0-7.781-3.483-7.781-7.781v-12.06h-12.06c-4.298,0-7.781-3.483-7.781-7.781 c0-4.298,3.483-7.781,7.781-7.781h12.06v-12.063c0-4.298,3.483-7.781,7.781-7.781c4.298,0,7.781,3.483,7.781,7.781v12.063h12.06 c4.298,0,7.781,3.483,7.781,7.781C167.036,143.488,163.555,146.971,159.255,146.971z"/><path d="M149.997,0C67.157,0,0.001,67.158,0.001,149.995s67.156,150.003,149.995,150.003s150-67.163,150-150.003 S232.836,0,149.997,0z M225.438,221.254c-2.371,2.376-5.48,3.561-8.59,3.561s-6.217-1.185-8.593-3.561l-34.145-34.147 c-9.837,6.863-21.794,10.896-34.697,10.896c-33.548,0-60.742-27.196-60.742-60.744c0-33.548,27.194-60.742,60.742-60.742 c33.548,0,60.744,27.194,60.744,60.739c0,11.855-3.408,22.909-9.28,32.256l34.56,34.562 C230.185,208.817,230.185,216.512,225.438,221.254z"/></symbol><symbol id="volume" viewBox="0 0 300 300"><title>volume</title><path d="M149.996,0C67.157,0,0.001,67.161,0.001,149.997S67.157,300,149.996,300s150.003-67.163,150.003-150.003 S232.835,0,149.996,0z M149.303,204.044h-0.002v-0.001c0,3.418-1.95,6.536-5.021,8.03c-1.24,0.602-2.578,0.903-3.909,0.903 c-1.961,0-3.903-0.648-5.506-1.901l-29.289-22.945c-1.354,0.335-2.767,0.537-4.235,0.537h-29.35 c-9.627,0-17.431-7.807-17.431-17.429v-50.837c0-9.625,7.804-17.431,17.431-17.431h29.352c1.707,0,3.348,0.257,4.912,0.711 l28.612-22.424c2.684-2.106,6.344-2.492,9.415-0.999c3.071,1.494,5.021,4.609,5.021,8.027V204.044z M178.616,167.361l-9.788-9.788 c2.256-3.084,3.608-6.87,3.608-10.979c0-4.536-1.631-8.699-4.331-11.936l9.713-9.713c5.177,5.745,8.362,13.323,8.362,21.649 C186.177,154.492,183.331,161.733,178.616,167.361z M191.307,180.054c7.944-8.901,12.781-20.624,12.781-33.46 c0-13.264-5.166-25.334-13.585-34.334l9.716-9.716c10.903,11.495,17.613,26.997,17.613,44.049c0,16.625-6.37,31.792-16.793,43.188 L191.307,180.054z M224.385,212.84l-9.713-9.716c13.793-14.846,22.25-34.715,22.25-56.532c0-22.243-8.797-42.454-23.073-57.393 l9.716-9.713c16.762,17.429,27.098,41.075,27.098,67.106C250.664,172.201,240.663,195.502,224.385,212.84z"/></symbol></svg>
!

CSS 

              
                * {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  width: 100vw;
  height: 100vh;
  padding: 10px;
  background:radial-gradient(circle at 50% 60%, rgb(68, 78, 101), rgba(68, 78, 101, 0) 50%), radial-gradient(circle at 10% 10%, rgb(42, 72, 76), rgba(42, 72, 76, 0) 50%), radial-gradient(circle at 90% 10%, rgb(52, 25, 109), rgba(52, 25, 109, 0) 50%), radial-gradient(circle at 90% 90%, rgb(65, 104, 105), rgba(65, 104, 105, 0) 50%), radial-gradient(circle at 10% 90%, rgb(81, 49, 130), rgba(81, 49, 130, 0) 50%);
  color: #fff;
  text-shadow: 1px 1px 1px rgba(0,0,0,.5);
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(128px, 1fr));
  gap: 20px;
  align-items: flex-start;
}

.icon {
  width: 1em;
  height: 1em;
  font-size: 128px;
}

div:nth-child(2n) .icon {
  filter: invert(20%) sepia(41%) saturate(6026%) hue-rotate(249deg) brightness(90%) contrast(95%);
}

div:nth-child(2n+1) .icon {
  filter: invert(24%) sepia(95%) saturate(6769%) hue-rotate(289deg) brightness(90%) contrast(98%);
}
!

JS
!
999px

Console