simple-icons/index.html
2015-10-15 15:38:16 +01:00

152 lines
23 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Simple Icons</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:400">
<style>
html {
font-size: 16px;
}
body {
color: #666;
font-family: Lato, sans-serif;
-webkit-font-feature-settings: "dlig", "kern", "liga";
font-feature-settings: "dlig", "kern", "liga";
-webkit-font-smoothing: antialiased;
font-weight: 400;
line-height: 1.5rem;
margin: 0;
-moz-osx-font-smoothing: grayscale;
}
a {
color: #333;
}
a:focus, a:hover {
color: #999;
}
.navbar {
background: #EEE;
text-align: center;
}
.title {
font-size: 1rem;
font-weight: 400;
letter-spacing: 0.05rem;
margin: 0;
padding: 1.5rem 1.5rem 0;
text-transform: uppercase;
}
.navbar__text {
font-size: 0.75rem;
letter-spacing: 0.05rem;
margin: 0;
padding: 0 1.5rem 1.5rem;
text-transform: uppercase;
}
@media (min-width: 800px) {
.navbar {
display: flex;
justify-content: space-between;
text-align: left;
}
.title {
padding: 1.5rem;
}
.navbar__text {
padding: 1.5rem;
}
}
.hero {
font-size: 0.75rem;
letter-spacing: 0.05rem;
margin: 0 auto;
max-width: 18rem;
padding: 3rem;
text-align: center;
text-transform: uppercase;
}
.tiles {
display: flex;
flex-wrap: wrap;
list-style: none;
margin: -0.25rem 1.25rem;
padding: 0;
}
.tiles li {
box-sizing: border-box;
background: #333;
border: 0.25rem solid #FFF;
color: #FFF;
font-size: 0.75rem;
letter-spacing: 0.05rem;
line-height: 1rem;
padding: 1.25rem 0.75rem 1.25rem;
text-transform: uppercase;
width: 100%;
}
.tiles li svg {
float: left;
height: 2rem;
margin: -0.5rem 0.75rem 0 0;
padding: 0.5rem 0.5rem 0;
}
.hex {
opacity: 0.5;
}
@media (min-width: 600px) { .tiles li { width: 50%; } }
@media (min-width: 800px) { .tiles li { width: 33.333%; } }
@media (min-width: 1000px) { .tiles li { width: 25% } }
@media (min-width: 1200px) { .tiles li { width: 20% } }
@media (min-width: 1500px) { .tiles li { width: 16.666% } }
@media (min-width: 1800px) { .tiles li { width: 12.5% } }
.footer {
margin: 3rem;
}
.footer p {
font-size: 0.75rem;
letter-spacing: 0.05rem;
margin: 0 auto;
max-width: 31.5rem;
text-align: center;
text-transform: uppercase;
}
</style>
</head>
<body>
<header class="navbar" role="banner">
<h1 class="title">Simple Icons</h1>
<p class="navbar__text">Share on <a href="#">Facebook</a> &amp; <a href="#">Twitter</a></p>
</header>
<main role="main">
<p class="hero">21 SVG icons for popular brands. Download them from <a href="https://github.com/danleech/simple-icons">GitHub</a>.</p>
<ul class="tiles"> <li style="background-color:#3B5998"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M15.117 0H.883C.395 0 0 .395 0 .883v14.234c0 .488.395.883.883.883h7.663V9.804H6.46V7.39h2.086V5.607c0-2.066 1.262-3.19 3.106-3.19.883 0 1.642.064 1.863.094v2.16h-1.28c-1 0-1.195.476-1.195 1.176v1.54h2.39l-.31 2.416h-2.08V16h4.077c.488 0 .883-.395.883-.883V.883C16 .395 15.605 0 15.117 0" fill="#fff" fill-rule="nonzero"/></svg>Facebook<br><span class="hex">#3B5998</span></li>
<li style="background-color:#4285F4"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M8.16 6.857V9.6h4.537c-.183 1.177-1.37 3.45-4.537 3.45-2.73 0-4.96-2.26-4.96-5.05s2.23-5.05 4.96-5.05c1.554 0 2.594.66 3.19 1.233l2.17-2.092C12.126.79 10.32 0 8.16 0c-4.423 0-8 3.577-8 8s3.577 8 8 8c4.617 0 7.68-3.246 7.68-7.817 0-.526-.057-.926-.126-1.326H8.16z" fill="#fff"/></svg>Google<br><span class="hex">#4285F4</span></li>
<li style="background-color:#3C80CA"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M7.21 15.725c-1.658.542-1.824.456-2.573-1.867l-1.835-5.68C2.366 6.833 1.032 3.207.807 2.512.392 1.22.392 1.15 2.827.357c1.91-.626 1.986-.605 2.68 1.548.56 1.735.918 3.132 1.49 4.904l1.563 4.834 4.993-1.633c.985-.324 1.314-.31 1.59.903l.202.916c.23 1.067-.308 1.338-.877 1.523L7.21 15.725z" fill="#fff" fill-rule="nonzero"/></svg>Lanyrd<br><span class="hex">#3C80CA</span></li>
<li style="background-color:#55ACEE"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M16 3.038c-.59.26-1.22.437-1.885.517.677-.407 1.198-1.05 1.443-1.816-.634.375-1.337.648-2.085.795-.598-.638-1.45-1.036-2.396-1.036-1.812 0-3.282 1.468-3.282 3.28 0 .258.03.51.085.75C5.152 5.39 2.733 4.084 1.114 2.1.83 2.583.67 3.147.67 3.75c0 1.14.58 2.143 1.46 2.732-.538-.017-1.045-.165-1.487-.41v.04c0 1.59 1.13 2.918 2.633 3.22-.276.074-.566.114-.865.114-.21 0-.416-.02-.617-.058.418 1.304 1.63 2.253 3.067 2.28-1.124.88-2.54 1.404-4.077 1.404-.265 0-.526-.015-.783-.045 1.453.93 3.178 1.474 5.032 1.474 6.038 0 9.34-5 9.34-9.338 0-.143-.004-.284-.01-.425.64-.463 1.198-1.04 1.638-1.7z" fill="#fff" fill-rule="nonzero"/></svg>Twitter<br><span class="hex">#55ACEE</span></li>
<li style="background-color:#005EA5"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><g fill="#fff" fill-rule="nonzero"><path d="M1.597 8.686c.174-.425-.026-.914-.453-1.09-.42-.173-.906.033-1.08.458-.176.423.026.907.445 1.08.427.177.912-.025 1.087-.448M2.173 6.528c.175-.423-.026-.912-.454-1.09-.42-.172-.908.035-1.082.457-.175.424.027.91.447 1.083.428.177.914-.026 1.088-.45M2.984 5.8c.427.175.912-.027 1.087-.45.175-.424-.025-.914-.45-1.09-.422-.173-.91.033-1.083.456-.175.425.027.91.447 1.083M5.085 6.507c.428.177.914-.025 1.088-.448.174-.424-.026-.915-.454-1.09-.42-.174-.907.033-1.082.457-.174.422.028.908.447 1.08M14.402 8.686c.183.423.666.623 1.09.443.42-.175.62-.66.445-1.082-.177-.426-.664-.626-1.085-.452-.424.174-.627.663-.45 1.09M14.908 6.977c.425-.173.625-.66.448-1.086-.18-.422-.664-.625-1.087-.447-.425.174-.622.66-.448 1.086.177.425.664.626 1.086.447M13.006 5.806c.42-.175.622-.662.448-1.087-.177-.427-.664-.627-1.088-.454-.422.18-.623.666-.446 1.09.175.422.662.623 1.086.45M10.734 6.38c.42-.175.62-.662.446-1.083-.177-.425-.665-.626-1.09-.453-.42.18-.62.667-.444 1.093.175.42.662.62 1.088.442M6.27 3.302l.062 1.596 1.165-.614c.024.026.053.052.08.072-.12.477-.413 1.273-.595 1.713-.223.54.033 1.16.573 1.383.54.222 1.162-.036 1.386-.577.156-.377.08-.786-.164-1.078-.26-.45-.52-1.02-.664-1.457.037-.027.07-.063.096-.102l1.256.65.053-1.59-1.312.425c-.012-.02-.025-.035-.038-.05l.516-1.455-1.557-.044.462 1.427c-.04.025-.07.055-.1.087L6.27 3.302zM14.184 9.362c.106.587.124.854-.01 1.236-.19-.19-.36-.536-.498-1.06l-.58 1.856c.345-.23.608-.376.907-.38-.542 1.14-1.21 1.428-1.637 1.345-.523-.104-.765-.576-.673-.974.116-.56.7-.7.963-.045.528-1.042-.345-1.382-.91-1.08.874-.852.976-1.614.284-2.552-.974.736-.992 1.47-.566 2.51-.56-.656-1.45-.31-1.14.74.417-.632.953-.23.864.376-.073.525-.774.94-1.637.854-1.24-.117-1.305-.973-1.327-1.68.302-.055.85.234 1.313.896l.19-1.973c-.514.52-.978.624-1.49.633.176-.526.966-1.397.966-1.397l-2.467-.012s.784.874.956 1.405c-.513-.016-.974-.117-1.483-.647l.172 1.974c.467-.657 1.015-.94 1.32-.882-.032.707-.106 1.56-1.344 1.673-.864.075-1.557-.35-1.63-.874-.084-.603.46-1.003.87-.368.318-1.05-.567-1.4-1.135-.75.44-1.037.428-1.774-.546-2.518-.7.928-.6 1.696.266 2.56-.564-.312-1.44.017-.924 1.07.27-.655.85-.51.97.054.08.398-.16.866-.686.963-.43.08-1.094-.215-1.627-1.36.3.006.562.157.902.39l-.56-1.858c-.14.52-.32.864-.51 1.05-.128-.377-.11-.65.006-1.235L.57 9.717c.613.836 1.235 2.005 1.722 4.055 1.514-.253 4.096-.404 5.66-.4 1.562.01 4.143.185 5.65.454.51-2.048 1.142-3.208 1.762-4.038l-1.178-.426z"/></g></svg>GOV.UK<br><span class="hex">#005EA5</span></li>
<li style="background-color:#0079BF"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M2 0C.895 0 0 .896 0 2v12c0 1.105.896 2 2 2h12c1.105 0 2-.896 2-2V2c0-1.105-.896-2-2-2H2zm8 2.08c-.53 0-.96.43-.96.96v5.08c0 .53.43.96.96.96h2.96c.53 0 .96-.43.96-.96V3.04c0-.53-.43-.96-.96-.96H10zm-6.96 0c-.53 0-.96.43-.96.96v9.08c0 .53.43.96.96.96H6c.53 0 .96-.43.96-.96V3.04c0-.53-.43-.96-.96-.96H3.04z" fill="#fff"/></svg>Trello<br><span class="hex">#0079BF</span></li>
<li style="background-color:#1AB7EA"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M15.992 4.275c-.07 1.56-1.16 3.697-3.263 6.41-2.176 2.832-4.017 4.248-5.522 4.248-.933 0-1.722-.862-2.367-2.588L3.55 7.6c-.48-1.724-.993-2.587-1.542-2.587-.12 0-.538.252-1.255.755L0 4.796C.79 4.1 1.568 3.406 2.335 2.71c1.053-.912 1.844-1.39 2.37-1.44 1.246-.12 2.012.733 2.3 2.56.31 1.97.526 3.194.647 3.673.36 1.634.754 2.45 1.185 2.45.335 0 .838-.53 1.51-1.59.67-1.06 1.028-1.866 1.076-2.42.096-.915-.263-1.374-1.077-1.374-.383 0-.778.087-1.185.262.788-2.58 2.29-3.834 4.508-3.762 1.644.048 2.42 1.116 2.324 3.205z" fill="#fff" fill-rule="nonzero"/></svg>Vimeo<br><span class="hex">#1AB7EA</span></li>
<li style="background-color:#56B68B"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><g fill="#fff" fill-rule="nonzero"><path d="M6.586 7.33l.69 2.057 2.137-.716-.69-2.056-2.137.716z"/><path d="M12.55 9.37l-1.037.347.36 1.073c.145.434-.09.904-.524 1.05-.096.03-.19.045-.287.042-.338-.01-.65-.226-.765-.566l-.36-1.072-2.138.716.36 1.072c.145.435-.09.905-.523 1.05-.096.032-.192.045-.286.043-.34-.01-.65-.226-.764-.566l-.36-1.075-1.037.348c-.096.03-.19.045-.286.042-.34-.008-.65-.226-.765-.565-.146-.434.09-.904.522-1.05L5.7 9.914l-.69-2.058-1.037.347c-.094.032-.19.045-.285.043-.338-.01-.65-.226-.765-.566-.145-.434.09-.904.523-1.05l1.037-.347-.36-1.073c-.145-.434.09-.904.524-1.05.435-.145.905.09 1.05.524l.36 1.072 2.137-.716-.36-1.072c-.144-.435.09-.905.524-1.05.435-.145.906.09 1.05.523l.36 1.075 1.037-.347c.434-.146.904.088 1.05.522.145.434-.09.904-.523 1.05l-1.037.347.69 2.057 1.036-.347c.435-.145.905.09 1.05.523.146.434-.09.904-.522 1.05zm2.78-3.57C13.68.304 11.298-.98 5.8.67.304 2.32-.98 4.7.67 10.2c1.65 5.497 4.03 6.78 9.53 5.13 5.497-1.65 6.78-4.03 5.13-9.53z"/></g></svg>Slack<br><span class="hex">#56B68B</span></li>
<li style="background-color:#00B057"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M.5 0h15v3.98H.5zm0 6.01h11.497v3.98H.5zm0 6.01h15V16H.5z" fill="#FFF" fill-rule="nonzero"/></svg>Koding<br><span class="hex">#00B057</span></li>
<li style="background-color:#5AB552"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><g fill="#fff"><path d="M3.85 2.273c.286-.167.583-.315.893-.444.655-.273 1.33-.44 2.024-.508l.752.857-.345.88c-.678.136-1.316.382-1.914.74l-.13.08-.125-1.16L3.85 2.27z"/><path d="M3.523 2.48l1.194.46.125 1.14c-.646.475-1.15 1.082-1.51 1.82-.034.066-.064.132-.093.2l-.835-1.02-1.37.29c.34-.736.8-1.394 1.375-1.974.345-.347.715-.652 1.113-.917zm7.857 8.036c.13-.216.235-.435.32-.66l1.292 1.567 2.17-.468c-.124.342-.272.677-.442 1.005-.446.86-1.034 1.606-1.765 2.24-.742.642-1.58 1.11-2.515 1.406-.018.006-.037.01-.055.017l-1.608-1.36.42-1.85.033-.014c.92-.393 1.638-1.02 2.15-1.885z"/><path d="M14.097 3.2c.133.183.257.373.375.57.495.832.837 1.722 1.027 2.67.186.94.212 1.886.08 2.835-.067.456-.167.9-.303 1.335l-2.166.466-1.3-1.572c.157-.578.17-1.18.04-1.806-.15-.743-.473-1.377-.97-1.9l2.34-.28.876-2.318zM.885 5.72l1.4-.296.824 1.006c-.255.723-.318 1.474-.19 2.254.033.222.082.437.144.646l-1.478-.337-1.06 1.254c-.128-.555-.19-1.123-.19-1.703.002-.967.18-1.9.538-2.8l.01-.025z"/><path d="M3.18 9.677c.213.562.526 1.076.94 1.544.31.356.66.65 1.042.88l-1.467.84.08 1.91c-.484-.3-.93-.66-1.334-1.077-.68-.698-1.2-1.5-1.562-2.404-.1-.25-.184-.5-.256-.75l1.083-1.28 1.477.337z"/><path d="M5.482 12.276c.315.157.653.277 1.012.36.805.186 1.59.155 2.353-.094L8.43 14.38l1.592 1.347c-.796.208-1.61.297-2.44.267-.97-.03-1.902-.236-2.794-.616-.24-.102-.47-.215-.694-.34l-.08-1.922 1.468-.84zm8.39-9.37l-.875 2.325-2.41.286c-.07-.06-.142-.12-.218-.177C9.58 4.74 8.69 4.39 7.7 4.29c-.226-.02-.445-.028-.66-.02l.84-2.153L6.067.052C6.613.005 7.158-.01 7.7.006c.327.01.65.034.973.075.453.06.9.153 1.343.28.937.262 1.79.69 2.562 1.282.486.374.918.796 1.295 1.266z"/></g></svg>Event Store<br><span class="hex">#5AB552</span></li>
<li style="background-color:#6Fb536"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M6.348 10.075V5.58l4.323 2.255-4.322 2.24zM15.84 4.8s-.156-1.102-.636-1.587c-.608-.637-1.29-.64-1.603-.678-2.238-.162-5.596-.162-5.596-.162h-.008s-3.358 0-5.597.162c-.314.038-.996.04-1.604.678C.316 3.698.16 4.8.16 4.8S0 6.097 0 7.39v1.215c0 1.294.16 2.59.16 2.59s.156 1.1.636 1.587c.608.637 1.408.617 1.764.684 1.28.123 5.44.16 5.44.16s3.362-.004 5.6-.166c.314-.038.996-.04 1.604-.678.48-.486.636-1.588.636-1.588S16 9.9 16 8.604V7.39c0-1.294-.16-2.59-.16-2.59" fill="#fff" fill-rule="nonzero"/></svg>Evernote<br><span class="hex">#6Fb536</span></li>
<li style="background-color:#9DB63B"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M1.646 14.93S-.82 9.035 3.6 4.64C7.61.646 13.666.028 14.717 0c0 0 1.626 5.337-2.434 11.387-4.055 6.05-9.68 4.41-9.68 4.41S8.16 8.713 7.49 8.757c-.467.027-3.383 3.237-5.844 6.174" fill="#fff" fill-rule="nonzero"/></svg>Khan Academy<br><span class="hex">#9DB63B</span></li>
<li style="background-color:#EE6123"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M8.72 14.2c-.898.016-1.553-.273-1.593-1.057-.015-.295-.01-.608.004-.798.088-1.146.89-1.97 1.682-2.13.984-.197 1.64.254 1.64 1.542 0 .87-.242 2.417-1.732 2.443zM7.964 0C3.554 0 0 3.538 0 8.165c0 2.4 1.283 4.717 3.088 6.11.347.268.76.243 1 .013.198-.193.182-.66-.19-.987-1.443-1.267-2.44-3.188-2.44-5.106 0-3.446 3.06-6.345 6.506-6.345 4.194 0 6.437 3.406 6.437 6.293 0 1.764-.86 3.895-2.42 5.253.004-.006.325-.637.325-1.867 0-2.095-1.327-3.23-2.866-3.23-1.115 0-1.782.4-2.236.77 0-.852.028-2.444.028-2.444 0-1.052-.368-1.893-1.652-1.91-.742-.012-1.294.33-1.637 1.1-.124.288-.08.602.166.744.202.118.535.03.7-.19.11-.137.172-.167.268-.156.157.017.163.27.17.433.004.125.126 1.937.06 6.593 0 1.285 1.007 2.76 3.42 2.76 1.037 0 1.834-.29 2.993-.948C13.485 14.05 16 11.827 16 8.07 16 3.37 12.196 0 7.964 0" fill="#fff" fill-rule="nonzero"/></svg>Bitly<br><span class="hex">#EE6123</span></li>
<li style="background-color:#DD4B39"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><g fill="#fff"><path d="M5.09 7.273v1.745H7.98c-.116.75-.873 2.197-2.887 2.197-1.737 0-3.155-1.44-3.155-3.215S3.353 4.785 5.09 4.785c.99 0 1.652.422 2.03.786l1.382-1.33c-.887-.83-2.037-1.33-3.41-1.33C2.275 2.91 0 5.184 0 8s2.276 5.09 5.09 5.09c2.94 0 4.888-2.065 4.888-4.974 0-.334-.036-.59-.08-.843H5.09zM16 7.273h-1.455V5.818H13.09v1.455h-1.454v1.454h1.455v1.455h1.455V8.727H16"/></g></svg>Google+<br><span class="hex">#DD4B39</span></li>
<li style="background-color:#CD201F"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M6.348 10.075V5.58l4.323 2.255-4.322 2.24zM15.84 4.8s-.156-1.102-.636-1.587c-.608-.637-1.29-.64-1.603-.678-2.238-.162-5.596-.162-5.596-.162h-.008s-3.358 0-5.597.162c-.314.038-.996.04-1.604.678C.316 3.698.16 4.8.16 4.8S0 6.097 0 7.39v1.215c0 1.294.16 2.59.16 2.59s.156 1.1.636 1.587c.608.637 1.408.617 1.764.684 1.28.123 5.44.16 5.44.16s3.362-.004 5.6-.166c.314-.038.996-.04 1.604-.678.48-.486.636-1.588.636-1.588S16 9.9 16 8.604V7.39c0-1.294-.16-2.59-.16-2.59" fill="#fff" fill-rule="nonzero"/></svg>YouTube<br><span class="hex">#CD201F</span></li>
<li style="background-color:#E12828"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><g fill="#fff"><path d="M0 0h5.16v16H0zM5.677 5.677h5.16v5.16h-5.16zM5.677 0H16v5.16H5.677z"/></g></svg>Flipboard<br><span class="hex">#E12828</span></li>
<li style="background-color:#EA4C89"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M8 16c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm6.747-6.905c-.234-.074-2.115-.635-4.257-.292.894 2.456 1.258 4.456 1.328 4.872 1.533-1.037 2.624-2.68 2.93-4.58zM10.67 14.3c-.102-.6-.5-2.688-1.46-5.18l-.044.014C5.312 10.477 3.93 13.15 3.806 13.4c1.158.905 2.614 1.444 4.194 1.444.947 0 1.85-.194 2.67-.543zm-7.747-1.72c.155-.266 2.03-3.37 5.555-4.51.09-.03.18-.056.27-.08-.173-.39-.36-.778-.555-1.16C4.78 7.85 1.47 7.807 1.17 7.8l-.003.208c0 1.755.665 3.358 1.756 4.57zM1.31 6.61c.307.005 3.122.017 6.318-.832-1.132-2.012-2.353-3.705-2.533-3.952-1.912.902-3.34 2.664-3.784 4.785zM6.4 1.368c.188.253 1.43 1.943 2.548 4 2.43-.91 3.46-2.293 3.582-2.468C11.323 1.827 9.736 1.176 8 1.176c-.55 0-1.087.066-1.6.19zm6.89 2.322c-.145.194-1.29 1.662-3.816 2.694.16.325.31.656.453.99.05.117.1.235.147.352 2.274-.286 4.533.172 4.758.22-.015-1.613-.59-3.094-1.543-4.257z" fill="#fff"/></svg>Dribbble<br><span class="hex">#EA4C89</span></li>
<li style="background-color:#AD29B6"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M15.81 6.616h-5.59l-3.266 3.28h4.485c-.59 1.316-1.902 2.04-3.432 2.04-2.072 0-3.758-1.78-3.758-3.848 0-2.075 1.686-3.808 3.758-3.808.755 0 1.458.196 2.04.58l3.027-3.04C11.693.687 9.927 0 8 0 3.58 0 0 3.578 0 8c0 4.415 3.58 8 8 8s8-3.41 8-7.826c0-.597-.068-.9-.19-1.558z" fill="#fff" fill-rule="nonzero"/></svg>JustGiving<br><span class="hex">#AD29B6</span></li>
<li style="background-color:#314359"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><g fill="#fff" fill-rule="nonzero"><path d="M14.634 12.716c-.103 0-.206-.03-.297-.09-.246-.167-.31-.5-.15-.74.493-.73.75-1.588.75-2.48 0-.892-.257-1.75-.75-2.48-.165-.246-.096-.578.144-.738.247-.166.572-.097.738.143.612.91.932 1.973.932 3.076s-.32 2.167-.932 3.076c-.097.154-.263.234-.434.234z"/><path d="M13.108 11.853c-.103 0-.206-.03-.298-.092-.246-.164-.308-.496-.143-.736.326-.48.498-1.035.498-1.618 0-.577-.172-1.137-.498-1.618-.165-.245-.103-.57.143-.737.246-.165.572-.102.738.144.446.657.68 1.423.68 2.212 0 .795-.234 1.56-.68 2.212-.097.155-.27.235-.44.235zM10.62 7.085c-.21-2.132-2.01-3.8-4.2-3.8C4.606 3.284 3 4.45 2.423 6.14 1.058 6.342 0 7.52 0 8.942c0 1.562 1.275 2.836 2.84 2.836h7.272c1.31 0 2.378-1.063 2.378-2.372 0-1.137-.8-2.086-1.87-2.32zm-.508 3.63h-7.27c-.978 0-1.78-.794-1.78-1.772 0-.977.796-1.772 1.78-1.772.473 0 .92.184 1.257.52.204.207.542.207.753 0 .206-.204.206-.542 0-.753-.366-.366-.817-.618-1.31-.743.504-1.11 1.625-1.852 2.876-1.852 1.743 0 3.16 1.417 3.16 3.155 0 .337-.05.67-.16.99-.09.28.058.576.338.673.057.018.114.03.166.03.222 0 .428-.144.503-.367.068-.21.12-.423.154-.64.493.19.84.663.84 1.218.007.726-.588 1.315-1.308 1.315z"/></g></svg>Mixcloud<br><span class="hex">#314359</span></li>
<li style="background-color:#181717"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M8 0C3.58 0 0 3.582 0 8c0 3.535 2.292 6.533 5.47 7.59.4.075.547-.172.547-.385 0-.19-.007-.693-.01-1.36-2.226.483-2.695-1.073-2.695-1.073-.364-.924-.89-1.17-.89-1.17-.725-.496.056-.486.056-.486.803.056 1.225.824 1.225.824.714 1.223 1.873.87 2.33.665.072-.517.278-.87.507-1.07-1.777-.2-3.644-.888-3.644-3.953 0-.873.31-1.587.823-2.147-.083-.202-.358-1.015.077-2.117 0 0 .672-.215 2.2.82.638-.178 1.323-.266 2.003-.27.68.004 1.364.092 2.003.27 1.527-1.035 2.198-.82 2.198-.82.437 1.102.163 1.915.08 2.117.513.56.823 1.274.823 2.147 0 3.073-1.87 3.75-3.653 3.947.287.246.543.735.543 1.48 0 1.07-.01 1.933-.01 2.195 0 .215.144.463.55.385C13.71 14.53 16 11.534 16 8c0-4.418-3.582-8-8-8" fill="#fff"/></svg>GitHub<br><span class="hex">#181717</span></li>
<li style="background-color:#000000"><svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><g fill="#fff" fill-rule="nonzero"><path d="M3.226 6.763v.38h.023c.68-.41 1.38-.444 1.8-.444 1.135 0 1.52.323 1.668.442.26-.15.827-.443 1.79-.443 1.928 0 1.928.76 1.928 1.067V9.56H8.882V7.962c0-.33 0-.697-.827-.697-.408 0-.828.124-.975.307-.136.156-.193.297-.193.642V9.56H5.334V8.025c0-.474.01-.76-.804-.76-.41 0-.828.108-.987.27-.124.123-.204.253-.204.664v1.36H1.786V6.762h1.44zM14.18 7.382h-1.127v1.12c0 .396 0 .525.46.525.22 0 .413-.025.62-.064l.047-.006.146.57c-.545.1-1.14.11-1.31.11-.507 0-1.162-.074-1.404-.283-.206-.17-.23-.337-.23-.76V7.38h-.764v-.584h.763v-.553l1.673-.433v.986h1.127v.584zM1.027 11.14C.41 10.208 0 9.1 0 7.986 0 6.67.517 5.6 1.04 4.846h.624C1.2 5.873.886 6.746.886 8.014c0 1.455.516 2.577.75 3.085.007.007.022.033.022.04h-.63zM14.973 4.86C15.59 5.792 16 6.9 16 8.014c0 1.314-.517 2.387-1.04 3.14h-.624c.463-1.028.78-1.9.78-3.168 0-1.456-.518-2.576-.753-3.086-.007-.007-.02-.033-.02-.04h.63z"/></g></svg>MediaTemple<br><span class="hex">#000000</span></li>
</ul>
</main>
<footer class="footer" role="contentinfo">
<p>Distributed for free by <a href="https://twitter.com/bathtype">Dan Leech</a> under the Free Art License. Company logos in icons are copyright of their respective owners. <a href="#">“Buy me a coffee?”</a> — Dan Leech</p>
</footer>
</body>
</html>