Social.svg.min

Size
13,849 Kb
Views
80,960

How do I make an social.svg.min?

Über optimised social vector icons (file-sizewise). . What is a social.svg.min? How do you make a social.svg.min? This script and codes were developed by Andreas Larsen on 11 June 2022, Saturday.

Social.svg.min Previews

Social.svg.min - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Social.svg.min</title> <link href='https://fonts.googleapis.com/css?family=Roboto+Mono:300' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <p>These svg icons are up to 87% smaller than the official ones. <br> <a href="#" onclick="solidToggle(event)">Toggle</a> between background and solid mode. <br> Remember to add title elements inside your svg's for accessibility.
</p>
<p>Source: <a href="#" onclick="openSource(event)">github.com/larsenwork/social.svg.min</a></p>
<div class="social no-bg"> <a class="facebook"> <svg viewBox="0 0 800 800"> <path d="M445 643h-90V419h-75v-87h75v-64q0-55 32-86 30-29 80-29 28 0 67 3v78h-47q-42 0-42 38v60h86l-11 87h-75v224z" /> </svg> </a> <a class="twitter"> <svg viewBox="0 0 800 800"> <path d="M679 239s-21 34-55 57c7 156-107 329-314 329-103 0-169-50-169-50s81 17 163-45c-83-5-103-77-103-77s23 6 50-2c-93-23-89-110-89-110s23 14 50 14c-84-65-34-148-34-148s76 107 228 116c-22-121 117-177 188-101 37-6 71-27 71-27s-12 41-49 61c30-2 63-17 63-17z"/> </svg> </a> <a class="google-plus"> <svg viewBox="0 0 800 800"> <path d="M487 370c21 129-62 237-195 237-114 0-207-93-207-207s93-207 207-207c89 0 138 54 138 54l-56 54s-29-32-82-32c-71 0-128 59-128 131 0 73 57 131 128 131 81 0 113-58 117-90H292v-71h195zm189-59v59h59v60h-59v59h-59v-59h-59v-60h59v-59h59z" /> </svg> </a> <a class="linkedin"> <svg viewBox="0 0 800 800"> <path d="M268 629h-97V319h97zm157 0h-97V319h93v42h1q31-50 93-50 114 0 114 133v185h-96V466q0-70-49-70-59 0-59 69z" /> <circle cx="219" cy="220" r="56"/> </svg> </a> <br> <a class="round github"> <svg viewBox="0 0 800 800"> <path d="M400 139c144 0 260 116 260 260 0 115-75 213-178 247-9 3-17-2-17-13v-71c0-35-18-48-18-48 57-6 119-28 119-128 0-44-27-70-27-70s14-29-2-69c0 0-22-7-72 27-42-12-88-12-130 0-50-34-72-27-72-27-16 40-2 69-2 69s-27 26-27 70c0 100 62 122 119 128 0 0-14 10-17 35-15 7-53 18-76-22 0 0-13-25-39-27 0 0-26 0-2 16 0 0 17 8 29 38 0 0 16 51 88 35v44c0 11-9 16-18 13-103-34-178-132-178-247 0-144 116-260 260-260z"/> </svg> </a> <a class="round dribbble"> <svg viewBox="0 0 800 800"> <path d="M400 665c-146 0-265-119-265-265s119-265 265-265 265 119 265 265-119 265-265 265zm223-229s-69-22-140-9c30 81 43 161 43 161s82-49 97-152zM488 609s-15-90-48-172c-132 44-179 142-179 142s96 83 227 30zm-256-57c80-128 193-152 193-152s-12-27-19-39c-124 37-232 32-232 32s-8 87 58 159zm-54-198s102 2 210-28c-38-71-84-130-84-130-107 49-126 158-126 158zm169-174s50 65 85 134c84-31 118-83 118-83s-76-78-203-51zm102 167c6 11 20 44 20 44s64-11 157 7c0-85-51-141-51-141s-38 55-126 90z"/> </svg> </a> <a class="round behance"> <svg viewBox="0 0 800 800"> <path d="M569 532c28 0 49-15 56-33h62c-17 55-55 86-120 86-79 0-132-53-132-135 0-80 57-136 132-136 81 0 130 66 125 153H506c1 41 21 65 63 65zm-282 46H115V224h167c67 0 114 20 114 87 0 40-19 60-48 74 40 11 64 41 64 90 0 72-58 103-125 103zm-10-60c34 0 57-12 57-47 0-36-21-51-56-51h-85v98h84zm288-151c-34 0-57 22-59 55h115c-4-34-21-55-56-55zm-293 0c28 0 48-13 48-42 0-31-23-41-54-41h-73v83h79zm364-120v35H492v-35h144z"/> </svg> </a> <a class="round codepen"> <svg viewBox="0 0 800 800"> <path d="M140 482V320q0-10 10-18l238-158q12-8 24 0l238 158q9 6 10 19v158q0 10-10 19L412 656q-12 8-24 0L150 497q-9-6-10-15zm282-278v104l97 65 78-52zm-44 104V204L203 321l78 52zm-193 54v75l56-37zm193 234V492l-97-65-78 52zm22-143l79-53-79-53-79 53zm22 143l175-117-78-52-97 64v105zm193-159v-75l-56 38z"/> </svg> </a> <br> <a class="rounded instagram"> <svg viewBox="0 0 800 800"> <path d="M150 400c0-119 0-166 42-208s88-42 208-42 166 0 208 42 42 89 42 208 0 166-42 208-88 42-208 42-166 0-208-42-42-89-42-208zm455 0c0-114 0-148-29-176-29-29-62-29-176-29s-148 0-176 29c-29 29-29 62-29 176s0 148 29 176c29 29 62 29 176 29s148 0 176-29c29-29 29-62 29-176zM400 272a128 128 0 1 1 0 256 128 128 0 0 1 0-256zm0 211c46 0 83-37 83-83s-37-83-83-83-83 37-83 83 37 83 83 83zm163-216c0 16-13 30-30 30-16 0-30-14-30-30 0-17 14-30 30-30 17 0 30 13 30 30z"/> </svg> </a> <a class="rounded pinterest"> <svg viewBox="0 0 800 800"> <path d="M287 681c-9-3-15-77-6-115l38-163s-9-20-9-49c0-46 26-80 59-80 28 0 42 21 42 46 0 28-19 71-28 110-8 33 17 59 49 59 58 0 104-61 104-150 0-79-57-134-138-134-94 0-148 69-148 142 0 28 9.7 57.4 23 74 4 5 5 6 2 17l-8 31s-2 9.5-14 3c-41-22.3-63-78-63-126 0-104 75-199 217-199 114 0 203 81 203 190 0 113-72 205-171 205-55 0-75-38-75-38l-21 78c-11 41-47 102-56 99z" /> </svg> </a> <a class="rounded buffer"> <svg viewBox="0 0 800 800"> <path d="M381 661L150 553c-13-6-13-12-1-18l39-18c12-6 23-8 40 0l154 72c12 6 24 6 36 0l154-72c17-8 28-6 40 0l39 18c12 6 12 12-1 18L419 661c-13 6-25 6-38 0zm0-144L149 409c-12-6-12-12 0-18l39-18c12-6 25-7 40 0l154 72c12 6 24 6 36 0l154-72c15-7 28-6 40 0l39 18c12 6 12 12 0 18L419 517c-13 6-25 6-38 0zm0-144L149 265c-13-6-11-12 1-18l230-107c15-7 25-7 40 0l230 107c12 6 14 12 1 18L419 373c-13 6-25 6-38 0z"/> </svg> </a> <a class="rounded vk"> <svg viewBox="0 0 800 800"> <path d="M393 566c-135 0-208-143-276-285-10-21 6-23 16-23l81-1c12 0 17 9 20 15 13 31 66 142 92 129 18-9 15-107 4-122-7-9-20-12-26-13-5-1 3-11 13-16 18-9 87-9 111-3 28 7 19 32 19 95 0 20-4 50 11 58 24 12 81-101 91-131 3-8 9-11 19-11h85c20 0 27 1 30 8 5 12-9 40-44 87-57 77-65 70-17 114 46 42 55 63 57 66 14 28-11 34-21 34h-76c-9 0-21 0-38-11-29-19-55-70-76-64-17 5-20 34-21 53-1 16-10 21-20 21h-34z"/> </svg> </a> <a class="rounded medium"> <svg viewBox="0 0 800 800"> <path d="M650 267v328c0 14-12 20-28 12l-139-70 167-270z" fill-opacity=".4" /> <path d="M374 360l101-164c4-7 14-10 22-6l153 77-167 270-109-177z" fill-opacity=".6" /> <path d="M483 537l-170-85 4-185 166 270z" fill-opacity=".8" /> <path d="M317 595c0 14-10 20-23 14l-130-65c-8-4-14-13-14-22V204c0-11 7-17 18-12l149 75v328z" /> </svg> </a> <a class="rounded tumblr"> <svg viewBox="0 0 800 800"> <path d="M570 602c-15 25-66 44-121 44-126 0-194-46-194-144V378h-50c-2 0-3-1-3-3v-98c0-3 4-4 7-5 50-17 77-51 84-110 2-14 14-22 24-22h144c2 0 3 1 3 3v112c0 2 1 3 3 3h80c2 0 3 1 3 3v114c0 2-1 3-3 3h-81c-2 0-3 1-3 3v115c0 11 2 11 4 11h69s2 0 3 3zM440 161h-65s-3-1-4 6c-9 63-38 101-87 121 0 0-4 1-4 4v63c0 2 1 3 3 3h48c2 0 3 1 3 3v141c0 46 27 124 129 124 33 0 66-11 83-27 1-1 0-3 0-3l-20-60c-1-4-3-3-3-3-13 5-26 7-37 7-28 0-44-15-44-45V361c0-2 1-3 3-3h81c2 0 3-1 3-3v-74c0-2-1-3-3-3h-80c-2 0-3-1-3-3V164c0-2-1-3-3-3z"/> </svg> </a> <a class="rounded rss"> <svg viewBox="0 0 800 800"> <path d="M493 652H392c0-134-111-244-244-244V307c189 0 345 156 345 345zm71 0c0-228-188-416-416-416V132c285 0 520 235 520 520z"/> <circle cx="219" cy="581" r="71"/> </svg> </a> <br> <a class="rounded flickr"> <svg viewBox="0 0 800 800"> <circle cx="234" cy="400" r="136" class="flickr-blue"/> <circle cx="566" cy="400" r="136" class="flickr-pink"/> </svg> </a> <a class="rounded snapchat"> <svg viewBox="0 0 800 800"> <path d="M400 152c-23 0-98 6-133 83-14 30-7 82-5 122-14 14-38-3-48-3-20 0-39 21 1 36 21 8 55 16 39 49-2 3-36 79-112 94-10 2-9 25 63 34 8 1 6 35 17 35s23-5 42-5c65 0 68 50 136 50s71-50 136-50c19 0 31 5 42 5s9-34 17-35c72-9 73-32 63-34-76-15-110-91-112-94-16-33 18-41 39-49 40-15 21-36 1-36-10 0-34 17-48 3 2-40 9-92-5-122-35-77-110-83-133-83z"/> </svg> </a> <a class="rounded whatsapp"> <svg viewBox="0 0 800 800"> <path d="M519 454c4 2 7 10-1 31-6 16-33 29-49 29-96 0-189-113-189-167 0-26 9-39 18-48 8-9 14-10 18-10h12c4 0 9 0 13 10l19 44c5 11-9 25-15 31-3 3-6 7-2 13 25 39 41 51 81 71 6 3 10 1 13-2l19-24c5-6 9-4 13-2zM401 200c-110 0-199 90-199 199 0 68 35 113 35 113l-20 74 76-20s42 32 108 32c110 0 199-89 199-199 0-111-89-199-199-199zm0-40c133 0 239 108 239 239 0 132-108 239-239 239-67 0-114-29-114-29l-127 33 34-124s-32-49-32-119c0-131 108-239 239-239z"/> </svg> </a> <a class="rounded reddit"> <svg viewBox="0 0 800 800"> <path d="M460 668c36-19 84 7 74 43h-268c-10-36 38-62 74-43h120z" /> <ellipse cx="472" cy="536" rx="72" ry="86" /> <ellipse cx="328" cy="536" rx="72" ry="86" /> <path d="M425 711c55-30 89-158 67-268h-184c-22 110 12 238 67 268h50z" /> <circle cx="578" cy="269" r="44" /> <circle cx="222" cy="269" r="44" /> <ellipse cx="400" cy="329" rx="197" ry="129" /> <circle class="reddit-eyes" cx="331" cy="304" r="32" /> <circle class="reddit-eyes" cx="469" cy="304" r="32" /> <path class="reddit-line" d="M521 116l-88-20-32 102M468 388s-16 21-68 21-68-21-68-21" /> <circle cx="556" cy="123" r="34" /> </svg> </a> <br> <a class="rounded vine"> <svg viewBox="0 0 800 800"> <path d="M615 399v58s-27 7-59 7c-41 87-116 163-141 177-16 9-31 9-48-1-31-18-146-114-185-413h84c21 180 73 272 130 341 31-31 61-74 85-121-56-29-91-92-91-165 0-74 43-129 116-129 71 0 109 44 109 120 0 28-6 60-17 85-53 10-72-24-72-24s9-27 9-55c0-35-13-52-32-52-20 0-34 19-34 56 0 76 48 120 110 120 20 0 36-4 36-4z" /> </svg> </a> <a class="rounded youtube"> <svg viewBox="0 0 800 800"> <path d="M400 224c144 0 201 2 224 25 17 17 26 52.125 26 151s-9 134-26 151c-23 23-80 25-224 25s-201-2-224-25c-17-17-26-52.125-26-151s9-134 26-151c23-23 80-25 224-25zm-52 100v141l135-70z" /> </svg> </a> <a class="rounded spotify"> <svg viewBox="0 0 800 800"> <path d="M400 140c144 0 260 117 260 260S543 660 400 660 140 543 140 400s117-260 260-260zm113 354c-68-43-153-51-252-29-20 4-16 37 9 31 91-20 166-12 228 25 18 11 34-15 15-27zm32-76c-81-50-197-64-292-35-23 7-16 46 15 37 82-24 184-13 256 31 21 13 43-19 21-33zm7-48c34 19 52-23 26-39-96-57-254-63-340-35-30 10-17 55 15 45 75-23 215-19 299 29z"/> </svg> </a> <a class="rounded soundcloud"> <svg viewBox="0 0 800 800"> <path d="M123 545c10 2 21 6 21 20 0 12-8 20-25 20-10 0-19-5-24-12l9-8c4 5 10 8 16 8 7 0 11-2 11-7 0-4-2-6-14-9s-20-7-20-19c0-11 11-18 23-18 10 0 16 4 22 10l-9 9c-4-4-8-7-14-7-7 0-9 3-9 6 0 4 3 5 13 7zm58-25c17 0 27 13 27 32s-10 33-27 33-28-14-28-33 11-32 28-32zm52 1v35c0 10 4 17 12 17s13-7 13-17v-35h13v35c0 18-10 29-26 29-15 0-25-11-25-29v-35h13zm210 12c-9 0-15 7-15 19 0 11 6 20 15 20 6 0 10-2 13-8l10 7c-4 9-12 14-23 14-16 0-27-13-27-33 0-19 11-32 27-32 12 0 19 6 23 14l-11 5c-2-4-6-6-12-6zm105-13c17 0 27 13 27 32s-10 33-27 33-27-14-27-33 10-32 27-32zm52 1v35c0 10 5 17 13 17s13-7 13-17v-35h12v35c0 18-9 29-25 29-15 0-25-11-25-29v-35h12zm-301 0l26 40v-40h12v63h-11l-27-41v41h-12v-63h12zm74 0c18 0 31 8 31 31 0 22-16 32-32 32h-18v-63h19zm117 0v50h25v13h-38v-63h13zm184 0c18 0 31 8 31 31 0 22-16 32-32 32h-19v-63h20zm-493 51c10 0 14-9 14-20s-4-19-14-19-15 8-15 19 5 20 15 20zm367 0c10 0 14-9 14-20s-4-19-14-19-14 8-14 19 4 20 14 20zm-176 0c13 0 20-9 20-20 0-13-6-19-19-19h-7v39h6zm301 0c13 0 19-9 19-20 0-13-6-19-19-19h-6v39h6zm-442-83c-1 8-11 7-11 0l-5-73 5-140c0-7 11-8 11 0l6 140zm130-3l-4-70 4-176c0-11 17-11 17 0l4 176-4 70c-1 11-16 12-17 0zm-13-218l5 148-5 70c-1 12-15 10-16 0l-4-70 4-148c0-10 16-11 16 0zm-58 219c-1 9-13 10-14 1l-5-72 5-157c0-9 14-10 14 0l5 157zm455-77c0 47-38 84-85 84h-235c-5-1-9-4-9-9v-270c0-5 2-8 8-10 100-37 195 33 203 127 59-24 118 19 118 78zm-426-147l4 153-4 71c-1 10-14 10-15 0l-4-71 4-153c0-11 15-10 15 0zm-116 38l6 114-6 74c-1 7-9 7-10 0l-6-74 6-114c0-6 10-6 10 0zm58-37l5 152-5 72c-1 8-12 8-13 0l-5-72 5-152c0-9 13-9 13 0zm128-40c0-12 19-11 19 0l4 192-4 69c-1 12-18 12-19 0l-4-69zm-214 121l6 70-6 74c0 6-9 6-9 0l-6-74 6-70c1-6 9-5 9 0zm-28-5l7 75-7 74c0 4-8 4-8 0l-6-74 6-75c0-5 8-5 8 0zm-28 2l7 73-7 71c0 5-7 5-7 0l-6-71 6-73c0-4 7-5 7 0zm-28 13l8 60-8 61c-1 4-6 4-6 0l-6-61 6-59c1-7 5-7 6-1zm-25 25l6 35-6 38c-1 4-5 4-6 0l-5-38 5-36c1-6 5-7 6 1z"/> </svg> </a> <a class="rounded amazon"> <svg viewBox="0 0 800 800"> <path class="amz-a" d="M445 358c0 31 0 59-15 85-13 22-34 37-56 37-31 0-49-25-49-59 0-69 62-80 120-80v17zm81 196l62-53c7-5 5-15 0-22-14-20-30-37-30-74V279c0-69 0-105-36-139-31-30-82-40-121-40-76 0-163 28-180 125-2 10 6 15 12 16l78 8c7 0 13-8 14-15 7-32 32-48 65-48 18 0 35 6 45 21s10 32 10 59v10c-46 4-108 9-151 27-51 22-87 66-87 133 0 80 52 125 121 125 57 0 89-14 133-59 14 22 20 31 46 54 5 4 14 2 19-2z"/> <path class="amz-arrow" d="M642 626c10-7 3-20-10-15a591 591 0 0 1-522-33c-7-4-12 3-6 9a440 440 0 0 0 538 39zm28-32c8 10-10 56-18 76-3 6 4 7 9 3 35-29 44-91 37-100s-69-16-107 10c-8 6-1 10 3 9 20-4 68-7 76 2z"/> </svg> </a> <p class="divider">Alternates</p> <a class="google-plus"> <svg viewBox="0 0 800 800"> <path d="M651 363c23.37 168.396-79.705 297-246 297-144 0-260-116-260-260s116-260 260-260c70 0 130 26 175 68l-71 68c-19-19-53-40-104-40-89 0-161 73-161 164s72 164 161 164c104 0 142-74 148-112H405v-89h246z" /> </svg> </a> <a class="facebook"> <svg viewBox="0 0 800 800"> <path d="M604 170c15 0 26 11 26 26v408c0 15-11 26-26 26H487V452h60l9-70h-69v-44c0-20 6-34 35-34h37v-62s-24-3-54-3c-53 0-89 33-89 92v51h-60v70h60v178H196c-15 0-26-11-26-26V196c0-15 11-26 26-26h408z" /> </svg> </a> <a class="youtube"> <svg viewBox="0 0 800 800"> <path d="M535 256c118 0 165 1 184 20 14 14 21 43 21 124s-7 110-21 124c-19 19-66 20-184 20s-166-1-185-20c-14-14-21-43-21-124s7-110 21-124c19-19 67-20 185-20zm-357 93c25 0 37 18 37 43v56c0 27-13 43-37 43s-37-17-37-43v-56c0-24 11-43 37-43zm267 111c0 18 4 31 20 31 9 0 17-6 27-17v15h26V351h-26v105c-6 8-10 12-15 12-3 0-5-1-6-5V351h-26v109zm-191 31c-16 0-19-13-19-31V350h26v113c1 4 2 5 5 5 5 0 9-4 15-12V350h27v139h-27v-15c-10 11-18 17-27 17zm415 0c17.997 0 37-8.907 37-50h-26c0 16 0 27-12 27-9 0-12-6-12-19v-25h50v-28c0-28-13-47-38-47-26 0-38 19-38 48v48c0 28 14 46 39 46zm-56-98c0-24-4-44-23-44-9 0-18 6-26 16v-60h-25v184h25v-14c8 10 17 16 26 16 20 0 23-19 23-43v-55zm-221-62v158h27V331h30v-26h-86v26h29zM112 489H84v-76L50 303h29l19 73 19-73h29l-34 110v76zm77-39v-60c0-11-2-18-11-18s-11 7-11 18v60c0 13 3 18 11 18s11-5 11-18zm398-1c0 14-3 19-10 19-4 0-9-2-13-6v-84c4-4 9-6 13-6 7 0 10 4 10 18v59zm69-61c0-13 5-16 12-16 8 0 11 4 11 17v15h-23v-16z" /> </svg> </a> <a class="soundcloud"> <svg viewBox="0 0 800 800"> <path d="M231 534c-1 8-11 7-11 0l-5-73 5-140c0-7 11-8 11 0l6 140zm130-3l-4-70 4-176c0-11 17-11 17 0l4 176-4 70c-1 11-16 12-17 0zm-13-218l5 148-5 70c-1 12-15 10-16 0l-4-70 4-148c0-10 16-11 16 0zm-58 219c-1 9-13 10-14 1l-5-72 5-157c0-9 14-10 14 0l5 157zm455-77c0 47-38 84-85 84h-235c-5-1-9-4-9-9v-270c0-5 2-8 8-10 100-37 195 33 203 127 59-24 118 19 118 78zm-426-147l4 153-4 71c-1 10-14 10-15 0l-4-71 4-153c0-11 15-10 15 0zm-116 38l6 114-6 74c-1 7-9 7-10 0l-6-74 6-114c0-6 10-6 10 0zm58-37l5 152-5 72c-1 8-12 8-13 0l-5-72 5-152c0-9 13-9 13 0zm128-40c0-12 19-11 19 0l4 192-4 69c-1 12-18 12-19 0l-4-69zm-214 121l6 70-6 74c0 6-9 6-9 0l-6-74 6-70c1-6 9-5 9 0zm-28-5l7 75-7 74c0 4-8 4-8 0l-6-74 6-75c0-5 8-5 8 0zm-28 2l7 73-7 71c0 5-7 5-7 0l-6-71 6-73c0-4 7-5 7 0zm-28 13l8 60-8 61c-1 4-6 4-6 0l-6-61 6-59c1-7 5-7 6-1zm-25 25l6 35-6 38c-1 4-5 4-6 0l-5-38 5-36c1-6 5-7 6 1z"/> </svg> </a> <a class="github"> <svg viewBox="0 0 800 800"> <path d="M400 177c-127 0-223 103-223 223 0 104 72 188 160 214v-41c0-33 17-46 17-46-73-8-116-43-116-126 0-45 27-69 27-69s-14-26 2-67c25-6 71 26 71 26s24-9 63-9 63 9 63 9 46-32 71-26c16 41 2 67 2 67s27 24 27 69c0 83-43 118-116 126 0 0 17 13 17 46v41c87-27 158-109 158-214 0-120-96-223-223-223zm0-42c146 0 265 119 265 265S546 665 400 665 135 546 135 400s119-265 265-265z"/> </svg> </a> <a class="reddit"> <svg viewBox="0 0 800 800" class="alt"> <circle cx="616" cy="373" r="53" /> <circle cx="184" cy="373" r="53" /> <ellipse cx="400" cy="446" rx="240" ry="157" /> <circle class="reddit-eyes" cx="315" cy="416" r="39" /> <circle class="reddit-eyes" cx="485" cy="416" r="39" /> <path class="reddit-line" d="M548 188l-107-25-40 126m82 229s-18 25-83 25-83-25-83-25" /> <circle cx="590" cy="196" r="42" /> </svg> </a> <p class="divider">Badges</p> <div class="badges"> <a class="app-store"> <svg viewBox="0 0 2700 800"> <path d="M1303 211s0-21 21-21c20 0 19 22 19 22v57h21v-57s1-40-33-40c-22 0-30 17-30 17l-1-15h-19l1 27v68h21v-58zm946 0s0-21 21-21c20 0 19 22 19 22v57h21v-57s1-40-33-40c-22 0-28 17-28 17v-58h-21v138h21v-58zm-820 423c113 0 113-200 6-200-49 0-66 36-66 36l-2-32h-38l2 43v227h43V607s13 27 55 27zm-8-166c67 0 67 133-1 133-45 0-46-47-46-47v-35s1-51 47-51zm-323-247c0-65-92-65-92 1 0 67 92 65 92-1zm-22 0c0 46-49 47-49 1 0-45 49-46 49-1zm469 0c0-65-92-65-92 1 0 67 92 65 92-1zm-22 0c0 46-49 47-49 1 0-45 49-46 49-1zm474-10s0-21 21-21c20 0 19 22 19 22v57h21v-57s1-40-33-40c-22 0-30 17-30 17l-1-15h-19l1 27v68h21v-58zM658 298s-33-51-101-51c-38 0-70 24-90 24-24 0-46-22-85-22-75 0-137 71-125 179 11 97 80 207 131 207 32 0 46-21 85-21s50 20 84 20c57 0 104-101 114-135-79-32-99-147-13-201zm-93-174c-55 4-108 58-102 118 59 2 108-58 102-118zm508 506l-86-266h-53l-86 266h44l24-78h87l24 78h46zm-78-111h-71l35-117zm213 115c113 0 113-200 6-200-49 0-66 36-66 36l-2-32h-38l2 46v224h43V607s13 27 55 27zm-8-166c68 0 68 133-1 133-45 0-46-47-46-47v-35s1-51 47-51zm465 166c55 0 96-27 96-79 0-42-30-63-67-78-24-10-51-20-51-47 0-23 21-35 46-35 29 0 51 12 51 12l11-34s-22-13-61-13c-49 0-90 28-90 75 0 33 23 59 70 76 26 9 48 21 48 48s-22 40-51 40c-37 0-61-17-61-17l-10 35s21 17 69 17zm148-67c0 43 15 67 54 67 21 0 33-5 33-5l-1-32s-8 2-19 2c-17 0-25-12-25-36v-93h47v-32h-47v-48l-42 13v35h-28v32h28v97zm301-34c0-133-188-134-188 3 0 133 188 131 188-3zm-44 1c0 92-101 93-101 1 0-91 101-93 101-1zm124-10s1-50 45-50c7 0 13 1 13 1v-40s-6-1-10-1c-42 0-53 43-53 43l-2-39h-37l1 41v151h43V524zm174 110c37 0 64-12 64-12l-6-30s-19 9-52 9c-63 0-60-57-60-57h128c6-60-18-110-79-110-65 0-90 57-90 102 0 52 29 98 95 98zm-54-120c0-10 10-51 46-51 45 0 42 51 42 51h-88zM981 200c0-42-26-63-71-63-20 0-36 3-36 3v128s18 2 30 2c48 0 77-23 77-70zm-22 1c0 33-17 52-50 52-9 0-15-1-15-1v-97s10-1 17-1c32 0 48 16 48 47zm296-27h-20l-19 75-20-75h-17l-22 75-17-75h-21l28 95h20l20-70 19 70h20zm146 95h21V131h-21v138zm168-26c0 31 41 37 57 15l2 11h19l-2-18v-40c0-26-12-39-37-39-20 0-32 8-32 8l4 14s9-7 25-7c14 0 19 7 19 21-28-1-55 9-55 35zm21-2c0-23 35-19 35-19v14c0 22-35 28-35 5zm125 30c24 0 31-17 31-17l1 15h19s-1-14-1-26V131h-21v54s-7-13-27-13c-54 0-56 99-2 99zm7-82c22 0 22 24 22 24v16s0 25-23 25c-32 0-34-65 1-65zm223 32c0-65-92-65-92 1 0 67 92 65 92-1zm-22 0c0 46-49 47-49 1 0-45 49-46 49-1zm232 17c0 20 8 33 26 33 12 0 17-3 17-3l-1-16s-3 1-9 1c-8 0-12-5-12-17v-46h23v-16h-23v-23l-21 6v17h-14v16h14v48zm232 32c20 0 32-5 32-5l-3-15s-8 4-26 4c-31 0-30-27-30-27h63c5-23-6-55-38-55-29 0-45 25-45 51 0 24 13 47 47 47zm-27-58s2-25 23-25c23 0 21 25 21 25h-44z"/> </svg> </a> <a class="google-play"> <svg viewBox="0 0 2700 800"> <path d="M499 464L235 664c-8-3-14-12-14-25V290c0-14 6-23 15-26l263 200z" fill="url(#goo1)"/> <path d="M499 530L258 661c-9 5-17 5-23 3l211-213 53 79z" fill="url(#goo2)"/> <path d="M236 264c6-2 14-1 22 4l240 131-53 77-209-212z" fill="url(#goo3)"/> <path d="M498 399l85 46c20 11 20 28 0 39l-84 46-66-66 65-65z" fill="url(#goo4)"/> <path d="M1292 230c35 0 61-27 61-61 0-35-27-62-61-62s-61 28-61 62 27 61 61 61zm0-14c-26 0-45-21-45-47s19-48 45-48 46 22 46 48-20 47-46 47zm-14 373c50 0 89-38 89-88s-39-89-89-89-89 39-89 89 39 88 89 88zm0-35c-28 0-50-24-50-53 0-30 21-54 50-54 30 0 50 23 50 54 0 29-22 53-50 53zm240 13v15c0 32-16 51-47 51-34 0-44-31-44-31l-34 14s19 52 78 52c54 0 84-35 84-92V418h-37v15c-7-10-26-21-47-21-47 0-85 41-85 89 0 47 38 88 85 88 21 0 39-9 47-22zm1030-156h-46l-47 117-50-117h-44l73 167-41 87h44zm-287-11c-56 0-73 41-73 41l34 16s10-21 39-21c21 0 44 13 44 39-32-18-123-13-123 53 0 49 49 63 68 63 25 0 41-10 54-30h2v24h39V480c0-54-38-80-84-80zm-527 189c35 0 60-19 74-39l-31-20s-12 24-43 24c-19 0-34-9-43-27l118-49c-11-33-36-66-79-66-49 0-84 39-84 89s38 88 88 88zm-650 0c50 0 89-38 89-88s-39-89-89-89-89 39-89 89 39 88 89 88zm-233 0c80 0 140-60 126-150H851v38h89c-5 47-40 74-89 74-56 0-99-44-99-99 0-57 44-100 99-100 26 0 48 9 67 27l27-27c-27-24-58-38-94-38-75 0-140 62-140 138s64 137 140 137zm1260-262v258h39V327h-39zm-117 0h-90v258h39V485h51c48 0 83-32 83-79s-35-79-83-79zm-370 257V324h-39v260h39zm-150-30c-29 0-49-24-49-53 0-30 20-54 49-54s47 24 47 54c0 29-19 53-47 53zm-390 0c-28 0-50-24-50-53 0-30 21-54 50-54 30 0 50 23 50 54 0 29-22 53-50 53zm1171-2c-14 0-32-6-32-23 0-36 65-36 83-19 0 10-19 42-51 42zm-571-54c0-35 28-52 47-52 12 0 27 6 33 19zm311-133c27 0 42 23 42 41s-13 41-42 41h-52v-82h52zM842 165h-58v14h43c-1 23-20 37-43 37-25 0-46-21-46-47s21-48 46-48c22 0 33 14 33 14l10-10s-13-18-43-18c-34 0-61 27-61 62s26 61 61 61c34 0 62-22 58-65zm544 63v-97l60 97h16V110h-15v69l1 23h-1l-57-92h-19v118h15zm-198-104v-14h-81v14h33v104h15V124h33zm-97 104V110h-15v118h15zm-67-104v-14h-81v14h33v104h15V124h33zm-94 0v-14h-69v118h69v-15h-54v-37h49v-14h-49v-38h54z"/> <defs> <linearGradient id="goo1" gradientTransform="rotate(90)"><stop offset="0%" stop-color="#3588b7"/><stop offset="100%" stop-color="#66ffd4"/></linearGradient> <linearGradient id="goo2"><stop offset="0%" stop-color="#9635c2"/><stop offset="100%" stop-color="#e3424f"/></linearGradient> <linearGradient id="goo3"><stop offset="0%" stop-color="#60cab6"/><stop offset="100%" stop-color="#d6ffa2"/></linearGradient> <linearGradient id="goo4" gradientTransform="rotate(45)"><stop offset="0%" stop-color="#ff9877"/><stop offset="100%" stop-color="#ffc466"/></linearGradient> </defs> </svg> </a> <p class="divider"> Badges with aligned Google Play (to match ) </p> <a class="google-play"> <svg viewBox="0 0 2700 800" xmlns="http://www.w3.org/2000/svg"> <path d="M499 400L235 600c-8-3-14-12-14-25V226c0-14 6-23 15-26l263 200z" fill="url(#goo1)"/> <path d="M499 466L258 597c-9 5-17 5-23 3l211-213 53 79z" fill="url(#goo2)"/> <path d="M236 200c6-2 14-1 22 4l240 131-53 77-209-212z" fill="url(#goo3)"/> <path d="M498 335l85 46c20 11 20 28 0 39l-84 46-66-66 65-65z" fill="url(#goo4)"/> <path d="M1293 264c35 0 61-27 61-61 0-35-27-62-61-62s-61 28-61 62 27 61 61 61zm0-14c-26 0-45-21-45-47s19-48 45-48 46 22 46 48-20 47-46 47zm-14 373c50 0 89-38 89-88s-39-89-89-89-89 39-89 89 39 88 89 88zm0-35c-28 0-50-24-50-53 0-30 21-54 50-54 30 0 50 23 50 54 0 29-22 53-50 53zm240 13v15c0 32-16 51-47 51-34 0-44-31-44-31l-34 14s19 52 78 52c54 0 84-35 84-92V452h-37v15c-7-10-26-21-47-21-47 0-85 41-85 89 0 47 38 88 85 88 21 0 39-9 47-22zm1030-156c0-1-46-1-46-1l-47 118-51-118-44 1 74 167-41 87h44l111-254zm-244 150h2v24h39V514c0-54-38-80-84-80-56 0-73 41-73 41l34 16s10-21 39-21c21 0 44 13 44 39-32-18-123-13-123 53 0 49 49 63 68 63 25 0 41-10 54-30zm-570 28c35 0 60-19 74-39l-31-20s-12 24-43 24c-19 0-34-9-43-27l118-49c-11-33-36-66-79-66-49 0-84 39-84 89s38 88 88 88zm-650 0c50 0 89-38 89-88s-39-89-89-89-89 39-89 89 39 88 89 88zm-233 0c80 0 140-60 126-150H852v38h89c-5 47-40 74-89 74-56 0-99-44-99-99 0-57 44-100 99-100 26 0 48 9 67 27l27-27c-27-24-58-38-94-38-75 0-140 62-140 138s64 137 140 137zm1299-4V361h-39v258h39zm-156-258h-90v258h39V519h51c48 0 83-32 83-79s-35-79-83-79zm-370 257V358h-39v260h39zm-150-30c-29 0-49-24-49-53 0-30 20-54 49-54s47 24 47 54c0 29-19 53-47 53zm-390 0c-28 0-50-24-50-53 0-30 21-54 50-54 30 0 50 23 50 54 0 29-22 53-50 53zm1171-2c-14 0-32-6-32-23 0-36 65-36 83-19 0 10-19 42-51 42zm-571-54c0-35 28-52 47-52 12 0 27 6 33 19l-80 33zm311-133c27 0 42 23 42 41s-13 41-42 41h-52v-82h52zM843 199h-58v14h43c-1 23-20 37-43 37-25 0-46-20-46-47 0-30 23-48 46-48s33 14 33 14l10-10s-13-18-43-18c-34 0-61 27-61 62 0 33 26 61 61 61 34 0 63-25 58-65zm544 63v-97l60 97h16V144h-15v69l1 23h-1l-57-92h-19v118h15zm-198-104v-14h-81v14h33v104h15V158h33zm-97 104V144h-15v118h15zm-67-104v-14h-81v14h33v104h15V158h33zm-94 0v-14h-69v118h69v-15h-54v-37h49v-14h-49v-38h54z"/> <defs> <linearGradient id="goo1" gradientTransform="rotate(90)"><stop offset="0%" stop-color="#3588b7"/><stop offset="100%" stop-color="#66ffd4"/></linearGradient> <linearGradient id="goo2"><stop offset="0%" stop-color="#9635c2"/><stop offset="100%" stop-color="#e3424f"/></linearGradient> <linearGradient id="goo3"><stop offset="0%" stop-color="#60cab6"/><stop offset="100%" stop-color="#d6ffa2"/></linearGradient> <linearGradient id="goo4" gradientTransform="rotate(45)"><stop offset="0%" stop-color="#ff9877"/><stop offset="100%" stop-color="#ffc466"/></linearGradient> </defs> </svg> </a> <a class="app-store"> <svg viewBox="0 0 2700 800"> <path d="M1303 211s0-21 21-21c20 0 19 22 19 22v57h21v-57s1-40-33-40c-22 0-30 17-30 17l-1-15h-19l1 27v68h21v-58zm946 0s0-21 21-21c20 0 19 22 19 22v57h21v-57s1-40-33-40c-22 0-28 17-28 17v-58h-21v138h21v-58zm-820 423c113 0 113-200 6-200-49 0-66 36-66 36l-2-32h-38l2 43v227h43V607s13 27 55 27zm-8-166c67 0 67 133-1 133-45 0-46-47-46-47v-35s1-51 47-51zm-323-247c0-65-92-65-92 1 0 67 92 65 92-1zm-22 0c0 46-49 47-49 1 0-45 49-46 49-1zm469 0c0-65-92-65-92 1 0 67 92 65 92-1zm-22 0c0 46-49 47-49 1 0-45 49-46 49-1zm474-10s0-21 21-21c20 0 19 22 19 22v57h21v-57s1-40-33-40c-22 0-30 17-30 17l-1-15h-19l1 27v68h21v-58zM658 298s-33-51-101-51c-38 0-70 24-90 24-24 0-46-22-85-22-75 0-137 71-125 179 11 97 80 207 131 207 32 0 46-21 85-21s50 20 84 20c57 0 104-101 114-135-79-32-99-147-13-201zm-93-174c-55 4-108 58-102 118 59 2 108-58 102-118zm508 506l-86-266h-53l-86 266h44l24-78h87l24 78h46zm-78-111h-71l35-117zm213 115c113 0 113-200 6-200-49 0-66 36-66 36l-2-32h-38l2 46v224h43V607s13 27 55 27zm-8-166c68 0 68 133-1 133-45 0-46-47-46-47v-35s1-51 47-51zm465 166c55 0 96-27 96-79 0-42-30-63-67-78-24-10-51-20-51-47 0-23 21-35 46-35 29 0 51 12 51 12l11-34s-22-13-61-13c-49 0-90 28-90 75 0 33 23 59 70 76 26 9 48 21 48 48s-22 40-51 40c-37 0-61-17-61-17l-10 35s21 17 69 17zm148-67c0 43 15 67 54 67 21 0 33-5 33-5l-1-32s-8 2-19 2c-17 0-25-12-25-36v-93h47v-32h-47v-48l-42 13v35h-28v32h28v97zm301-34c0-133-188-134-188 3 0 133 188 131 188-3zm-44 1c0 92-101 93-101 1 0-91 101-93 101-1zm124-10s1-50 45-50c7 0 13 1 13 1v-40s-6-1-10-1c-42 0-53 43-53 43l-2-39h-37l1 41v151h43V524zm174 110c37 0 64-12 64-12l-6-30s-19 9-52 9c-63 0-60-57-60-57h128c6-60-18-110-79-110-65 0-90 57-90 102 0 52 29 98 95 98zm-54-120c0-10 10-51 46-51 45 0 42 51 42 51h-88zM981 200c0-42-26-63-71-63-20 0-36 3-36 3v128s18 2 30 2c48 0 77-23 77-70zm-22 1c0 33-17 52-50 52-9 0-15-1-15-1v-97s10-1 17-1c32 0 48 16 48 47zm296-27h-20l-19 75-20-75h-17l-22 75-17-75h-21l28 95h20l20-70 19 70h20zm146 95h21V131h-21v138zm168-26c0 31 41 37 57 15l2 11h19l-2-18v-40c0-26-12-39-37-39-20 0-32 8-32 8l4 14s9-7 25-7c14 0 19 7 19 21-28-1-55 9-55 35zm21-2c0-23 35-19 35-19v14c0 22-35 28-35 5zm125 30c24 0 31-17 31-17l1 15h19s-1-14-1-26V131h-21v54s-7-13-27-13c-54 0-56 99-2 99zm7-82c22 0 22 24 22 24v16s0 25-23 25c-32 0-34-65 1-65zm223 32c0-65-92-65-92 1 0 67 92 65 92-1zm-22 0c0 46-49 47-49 1 0-45 49-46 49-1zm232 17c0 20 8 33 26 33 12 0 17-3 17-3l-1-16s-3 1-9 1c-8 0-12-5-12-17v-46h23v-16h-23v-23l-21 6v17h-14v16h14v48zm232 32c20 0 32-5 32-5l-3-15s-8 4-26 4c-31 0-30-27-30-27h63c5-23-6-55-38-55-29 0-45 25-45 51 0 24 13 47 47 47zm-27-58s2-25 23-25c23 0 21 25 21 25h-44z"/> </svg> </a> </div> <p class="divider">Generic icons</p> <a class="email generic"> <svg viewBox="0 0 800 800"> <path d="M627 180c29 0 53 24 53 53v334c0 29-24 53-53 53H173c-29 0-53-24-53-53V233c0-29 24-53 53-53h454zm-7 113v-53L400 387 180 240v53l220 147z"/> </svg> </a> <a class="location generic"> <svg viewBox="0 0 800 800"> <path d="M400 130c97 0 175 79 175 176 0 168-175 388-175 388S225 474 225 306c0-97 78-176 175-176zm0 262c46 0 83-37 83-83s-37-84-83-84-83 38-83 84 37 83 83 83z"/> </svg> </a> <a class="phone generic"> <svg viewBox="0 0 800 800"> <path d="M627 513c22 23 38 50 1 95-35 42-61 42-92 42-76 0-188-96-243-152-53-55-143-170-143-251 0-30 13-59 47-81 35-23 68-22 95 11 22 27 81 92 44 142-25 33-22 32 2 59 25 28 51 55 89 89 21 16 17 19 55-7 44-30 123 33 145 53z"/> </svg> </a>
</div> <script src="js/index.js"></script>
</body>
</html>

Social.svg.min - Script Codes CSS Codes

.social a { margin: 0.6rem; -webkit-transition: 0.5s ease; transition: 0.5s ease; height: 15vw; width: 15vw; max-width: 6rem; max-height: 6rem; display: inline-block;
}
.social a:hover { cursor: pointer;
}
.social a svg { height: 100%; width: 100%; fill: white;
}
.social .badges a { border-radius: 1rem;
}
.round { border-radius: 50%;
}
.rounded { border-radius: 20%;
}
.amazon { background: #383940;
}
.amazon:focus, .amazon:hover { background: #202125;
}
.amazon .amz-arrow { fill: #fd9a00;
}
.amazon .amz-a { fill: #231f20;
}
.app-store { background: #383940;
}
.app-store:focus, .app-store:hover { background: #202125;
}
.behance { background: #1769ff;
}
.behance:focus, .behance:hover { background: #0050e3;
}
.buffer { background: #333333;
}
.buffer:focus, .buffer:hover { background: #1a1a1a;
}
.codepen { background: #383940;
}
.codepen:focus, .codepen:hover { background: #202125;
}
.dribbble { background: #ea4c89;
}
.dribbble:focus, .dribbble:hover { background: #e51e6b;
}
.facebook { background: #3b5998;
}
.facebook:focus, .facebook:hover { background: #2d4373;
}
.flickr { background: #e6e6e6;
}
.flickr:focus, .flickr:hover { background: #cccccc;
}
.flickr .flickr-blue { fill: #256DD9;
}
.flickr .flickr-pink { fill: #FE0084;
}
.generic { background: #383940;
}
.generic:focus, .generic:hover { background: #202125;
}
.github { background: #383940;
}
.github:focus, .github:hover { background: #202125;
}
.google-play { background: #383940;
}
.google-play:focus, .google-play:hover { background: #202125;
}
.google-plus { background: #dd4b39;
}
.google-plus:focus, .google-plus:hover { background: #c23321;
}
.instagram { background: #383940;
}
.instagram:focus, .instagram:hover { background: #202125;
}
.linkedin { background: #007bb6;
}
.linkedin:focus, .linkedin:hover { background: #005983;
}
.medium { background: #383940;
}
.medium:focus, .medium:hover { background: #202125;
}
.pinterest { background: #bd081c;
}
.pinterest:focus, .pinterest:hover { background: #8c0615;
}
.reddit { background: #cee3f8;
}
.reddit:focus, .reddit:hover { background: #a1caf2;
}
.reddit svg { stroke-width: 18; stroke: #383940;
}
.reddit svg.alt { stroke-width: 21;
}
.reddit svg:focus svg, .reddit svg:hover svg { stroke: #202125;
}
.reddit svg .reddit-eyes { fill: #f04a22; stroke-width: 0;
}
.reddit svg .reddit-line { stroke-linecap: round; fill: none; stroke-linejoin: round;
}
.rss { background: #D95B29;
}
.rss:focus, .rss:hover { background: #b0481f;
}
.snapchat { background: #f7ec1e;
}
.snapchat:focus, .snapchat:hover { background: #dad008;
}
.snapchat svg { stroke-width: 13; stroke: #25262a;
}
.soundcloud { background: #ff6000;
}
.soundcloud:focus, .soundcloud:hover { background: #cc4d00;
}
.spotify { background: #2ebd59;
}
.spotify:focus, .spotify:hover { background: #249446;
}
.tumblr { background: #36465D;
}
.tumblr:focus, .tumblr:hover { background: #232e3d;
}
.twitter { background: #55acee;
}
.twitter:focus, .twitter:hover { background: #2795e9;
}
.vine { background: #00B289;
}
.vine:focus, .vine:hover { background: #007f62;
}
.vk { background: #4D76A4;
}
.vk:focus, .vk:hover { background: #3d5d81;
}
.whatsapp { background: #25D366;
}
.whatsapp:focus, .whatsapp:hover { background: #1da851;
}
.youtube { background: #cd201f;
}
.youtube:focus, .youtube:hover { background: #a11918;
}
.no-bg a { background-color: transparent !important; margin: 0;
}
.no-bg .amazon svg { fill: #383940;
}
.no-bg .amazon:focus svg, .no-bg .amazon:hover svg { fill: #202125;
}
.no-bg .app-store svg { fill: #383940;
}
.no-bg .app-store:focus svg, .no-bg .app-store:hover svg { fill: #202125;
}
.no-bg .behance svg { fill: #1769ff;
}
.no-bg .behance:focus svg, .no-bg .behance:hover svg { fill: #0050e3;
}
.no-bg .buffer svg { fill: #333333;
}
.no-bg .buffer:focus svg, .no-bg .buffer:hover svg { fill: #1a1a1a;
}
.no-bg .codepen svg { fill: #383940;
}
.no-bg .codepen:focus svg, .no-bg .codepen:hover svg { fill: #202125;
}
.no-bg .dribbble svg { fill: #ea4c89;
}
.no-bg .dribbble:focus svg, .no-bg .dribbble:hover svg { fill: #e51e6b;
}
.no-bg .facebook svg { fill: #3b5998;
}
.no-bg .facebook:focus svg, .no-bg .facebook:hover svg { fill: #2d4373;
}
.no-bg .flickr:focus .flickr-blue, .no-bg .flickr:hover .flickr-blue { fill: #1e57ad;
}
.no-bg .flickr:focus .flickr-pink, .no-bg .flickr:hover .flickr-pink { fill: #cb0069;
}
.no-bg .generic svg { fill: #383940;
}
.no-bg .generic:focus svg, .no-bg .generic:hover svg { fill: #202125;
}
.no-bg .github svg { fill: #383940;
}
.no-bg .github:focus svg, .no-bg .github:hover svg { fill: #202125;
}
.no-bg .google-play svg { fill: #383940;
}
.no-bg .google-play:focus svg, .no-bg .google-play:hover svg { fill: #202125;
}
.no-bg .google-plus svg { fill: #dd4b39;
}
.no-bg .google-plus:focus svg, .no-bg .google-plus:hover svg { fill: #c23321;
}
.no-bg .instagram svg { fill: #383940;
}
.no-bg .instagram:focus svg, .no-bg .instagram:hover svg { fill: #202125;
}
.no-bg .linkedin svg { fill: #007bb6;
}
.no-bg .linkedin:focus svg, .no-bg .linkedin:hover svg { fill: #005983;
}
.no-bg .medium svg { fill: #383940;
}
.no-bg .medium:focus svg, .no-bg .medium:hover svg { fill: #202125;
}
.no-bg .pinterest svg { fill: #bd081c;
}
.no-bg .pinterest:focus svg, .no-bg .pinterest:hover svg { fill: #8c0615;
}
.no-bg .reddit svg { fill: white !important;
}
.no-bg .rss svg { fill: #D95B29;
}
.no-bg .rss:focus svg, .no-bg .rss:hover svg { fill: #b0481f;
}
.no-bg .snapchat svg { fill: #383940; stroke: #383940;
}
.no-bg .snapchat:focus svg, .no-bg .snapchat:hover svg { fill: #202125; stroke: #202125;
}
.no-bg .soundcloud svg { fill: #ff6000;
}
.no-bg .soundcloud:focus svg, .no-bg .soundcloud:hover svg { fill: #cc4d00;
}
.no-bg .spotify svg { fill: #2ebd59;
}
.no-bg .spotify:focus svg, .no-bg .spotify:hover svg { fill: #249446;
}
.no-bg .tumblr svg { fill: #36465D;
}
.no-bg .tumblr:focus svg, .no-bg .tumblr:hover svg { fill: #232e3d;
}
.no-bg .twitter svg { fill: #55acee;
}
.no-bg .twitter:focus svg, .no-bg .twitter:hover svg { fill: #2795e9;
}
.no-bg .vine svg { fill: #00B289;
}
.no-bg .vine:focus svg, .no-bg .vine:hover svg { fill: #007f62;
}
.no-bg .vk svg { fill: #4D76A4;
}
.no-bg .vk:focus svg, .no-bg .vk:hover svg { fill: #3d5d81;
}
.no-bg .whatsapp svg { fill: #25D366;
}
.no-bg .whatsapp:focus svg, .no-bg .whatsapp:hover svg { fill: #1da851;
}
.no-bg .youtube svg { fill: #cd201f;
}
.no-bg .youtube:focus svg, .no-bg .youtube:hover svg { fill: #a11918;
}
.social .app-store { width: 50.625vw; max-width: 20.25rem;
}
.social .google-play { width: 50.625vw; max-width: 20.25rem;
}
body { padding: 3vw; text-align: center; font-size: 0; margin: 0 auto; max-width: 80rem;
}
p { color: #383940; font-size: 0.8rem; margin: 1rem 0; line-height: 1.6; font-family: Roboto Mono; font-weight: 300;
}
p a { text-decoration: none; color: #55acee;
}
.divider { padding-top: 2rem;
}

Social.svg.min - Script Codes JS Codes

function solidToggle(event) { event.preventDefault() var social = document.getElementsByClassName('social')[0] social.classList.toggle('no-bg')
}
function openSource(event) { event.preventDefault() window.open( 'https://github.com/larsenwork/social.svg.min', '_blank' )
}
Social.svg.min - Script Codes
Social.svg.min - Script Codes
Home Page Home
Developer Andreas Larsen
Username larsenwork
Uploaded June 11, 2022
Rating 4.5
Size 13,849 Kb
Views 80,960
Do you need developer help for Social.svg.min?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Andreas Larsen (larsenwork) Script Codes
Create amazing video scripts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!