mirror of
https://github.com/Mibew/simple-icons.git
synced 2024-11-17 10:54:12 +03:00
169 lines
8.4 KiB
HTML
169 lines
8.4 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 Open Graph Image</title>
|
||
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:400">
|
||
|
|
<style>
|
||
|
|
html {
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
body {
|
||
|
|
margin: 1.5rem 0;
|
||
|
|
}
|
||
|
|
.sharing {
|
||
|
|
background: #EEE;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
height: 70rem;
|
||
|
|
justify-content: center;
|
||
|
|
margin: 0 auto;
|
||
|
|
width: 140rem;
|
||
|
|
}
|
||
|
|
.bars {
|
||
|
|
list-style: none;
|
||
|
|
margin: 0 auto;
|
||
|
|
padding: 0;
|
||
|
|
width: 60rem;
|
||
|
|
}
|
||
|
|
.bars__item {
|
||
|
|
background: #000;
|
||
|
|
border: 0.375rem solid #EEE;
|
||
|
|
box-sizing: border-box;
|
||
|
|
display: inline-block;
|
||
|
|
float: left;
|
||
|
|
height: 1.5rem;
|
||
|
|
width: 20%;
|
||
|
|
}
|
||
|
|
.title {
|
||
|
|
clear: both;
|
||
|
|
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-size: 6rem;
|
||
|
|
font-weight: 400;
|
||
|
|
letter-spacing: 0.3rem;
|
||
|
|
line-height: 1.5rem;
|
||
|
|
margin: 6rem 0;
|
||
|
|
-moz-osx-font-smoothing: grayscale;
|
||
|
|
text-align: center;
|
||
|
|
text-transform: uppercase;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<div class="sharing">
|
||
|
|
<ul class="bars"> <li style="background-color:#4574E0" class="bars__item"></li>
|
||
|
|
<li style="background-color:#3B5998" class="bars__item"></li>
|
||
|
|
<li style="background-color:#1769FF" class="bars__item"></li>
|
||
|
|
<li style="background-color:#4285F4" class="bars__item"></li>
|
||
|
|
<li style="background-color:#094AB2" class="bars__item"></li>
|
||
|
|
<li style="background-color:#2D72D9" class="bars__item"></li>
|
||
|
|
<li style="background-color:#36465D" class="bars__item"></li>
|
||
|
|
<li style="background-color:#0063DC" class="bars__item"></li>
|
||
|
|
<li style="background-color:#314359" class="bars__item"></li>
|
||
|
|
<li style="background-color:#6383A8" class="bars__item"></li>
|
||
|
|
<li style="background-color:#3C80CA" class="bars__item"></li>
|
||
|
|
<li style="background-color:#205081" class="bars__item"></li>
|
||
|
|
<li style="background-color:#3399FF" class="bars__item"></li>
|
||
|
|
<li style="background-color:#0074E4" class="bars__item"></li>
|
||
|
|
<li style="background-color:#0084FF" class="bars__item"></li>
|
||
|
|
<li style="background-color:#2E9FFF" class="bars__item"></li>
|
||
|
|
<li style="background-color:#007EE5" class="bars__item"></li>
|
||
|
|
<li style="background-color:#55ACEE" class="bars__item"></li>
|
||
|
|
<li style="background-color:#005EA5" class="bars__item"></li>
|
||
|
|
<li style="background-color:#0072C6" class="bars__item"></li>
|
||
|
|
<li style="background-color:#125688" class="bars__item"></li>
|
||
|
|
<li style="background-color:#0079BF" class="bars__item"></li>
|
||
|
|
<li style="background-color:#0077B5" class="bars__item"></li>
|
||
|
|
<li style="background-color:#0099E5" class="bars__item"></li>
|
||
|
|
<li style="background-color:#1E8CBE" class="bars__item"></li>
|
||
|
|
<li style="background-color:#21759B" class="bars__item"></li>
|
||
|
|
<li style="background-color:#00AFF0" class="bars__item"></li>
|
||
|
|
<li style="background-color:#1AB7EA" class="bars__item"></li>
|
||
|
|
<li style="background-color:#40A4C4" class="bars__item"></li>
|
||
|
|
<li style="background-color:#00B7E3" class="bars__item"></li>
|
||
|
|
<li style="background-color:#34A7C1" class="bars__item"></li>
|
||
|
|
<li style="background-color:#4CADC0" class="bars__item"></li>
|
||
|
|
<li style="background-color:#005A5F" class="bars__item"></li>
|
||
|
|
<li style="background-color:#00B1AB" class="bars__item"></li>
|
||
|
|
<li style="background-color:#11B48A" class="bars__item"></li>
|
||
|
|
<li style="background-color:#02B875" class="bars__item"></li>
|
||
|
|
<li style="background-color:#56B68B" class="bars__item"></li>
|
||
|
|
<li style="background-color:#00B057" class="bars__item"></li>
|
||
|
|
<li style="background-color:#2BDE73" class="bars__item"></li>
|
||
|
|
<li style="background-color:#05CC47" class="bars__item"></li>
|
||
|
|
<li style="background-color:#5FCF80" class="bars__item"></li>
|
||
|
|
<li style="background-color:#66CC66" class="bars__item"></li>
|
||
|
|
<li style="background-color:#5AB552" class="bars__item"></li>
|
||
|
|
<li style="background-color:#64D448" class="bars__item"></li>
|
||
|
|
<li style="background-color:#6CC655" class="bars__item"></li>
|
||
|
|
<li style="background-color:#589442" class="bars__item"></li>
|
||
|
|
<li style="background-color:#7AB55C" class="bars__item"></li>
|
||
|
|
<li style="background-color:#467126" class="bars__item"></li>
|
||
|
|
<li style="background-color:#6Fb536" class="bars__item"></li>
|
||
|
|
<li style="background-color:#8CC63F" class="bars__item"></li>
|
||
|
|
<li style="background-color:#82BC23" class="bars__item"></li>
|
||
|
|
<li style="background-color:#84BD00" class="bars__item"></li>
|
||
|
|
<li style="background-color:#A4C639" class="bars__item"></li>
|
||
|
|
<li style="background-color:#9DB63B" class="bars__item"></li>
|
||
|
|
<li style="background-color:#F5C300" class="bars__item"></li>
|
||
|
|
<li style="background-color:#E6B91E" class="bars__item"></li>
|
||
|
|
<li style="background-color:#F4BD27" class="bars__item"></li>
|
||
|
|
<li style="background-color:#FBB631" class="bars__item"></li>
|
||
|
|
<li style="background-color:#FFA500" class="bars__item"></li>
|
||
|
|
<li style="background-color:#FF8000" class="bars__item"></li>
|
||
|
|
<li style="background-color:#F88D2D" class="bars__item"></li>
|
||
|
|
<li style="background-color:#F08C35" class="bars__item"></li>
|
||
|
|
<li style="background-color:#FF7102" class="bars__item"></li>
|
||
|
|
<li style="background-color:#F4731C" class="bars__item"></li>
|
||
|
|
<li style="background-color:#F45800" class="bars__item"></li>
|
||
|
|
<li style="background-color:#E44600" class="bars__item"></li>
|
||
|
|
<li style="background-color:#EE6123" class="bars__item"></li>
|
||
|
|
<li style="background-color:#FF4A00" class="bars__item"></li>
|
||
|
|
<li style="background-color:#FF4500" class="bars__item"></li>
|
||
|
|
<li style="background-color:#E6461A" class="bars__item"></li>
|
||
|
|
<li style="background-color:#FF3300" class="bars__item"></li>
|
||
|
|
<li style="background-color:#EB4924" class="bars__item"></li>
|
||
|
|
<li style="background-color:#DD4B39" class="bars__item"></li>
|
||
|
|
<li style="background-color:#E74430" class="bars__item"></li>
|
||
|
|
<li style="background-color:#C41200" class="bars__item"></li>
|
||
|
|
<li style="background-color:#EE3322" class="bars__item"></li>
|
||
|
|
<li style="background-color:#E62B1E" class="bars__item"></li>
|
||
|
|
<li style="background-color:#D51007" class="bars__item"></li>
|
||
|
|
<li style="background-color:#B92B27" class="bars__item"></li>
|
||
|
|
<li style="background-color:#CD201F" class="bars__item"></li>
|
||
|
|
<li style="background-color:#990000" class="bars__item"></li>
|
||
|
|
<li style="background-color:#E12828" class="bars__item"></li>
|
||
|
|
<li style="background-color:#FF6B6B" class="bars__item"></li>
|
||
|
|
<li style="background-color:#ED1C24" class="bars__item"></li>
|
||
|
|
<li style="background-color:#EC4047" class="bars__item"></li>
|
||
|
|
<li style="background-color:#BD081C" class="bars__item"></li>
|
||
|
|
<li style="background-color:#E6162D" class="bars__item"></li>
|
||
|
|
<li style="background-color:#EF3F56" class="bars__item"></li>
|
||
|
|
<li style="background-color:#F94877" class="bars__item"></li>
|
||
|
|
<li style="background-color:#F80046" class="bars__item"></li>
|
||
|
|
<li style="background-color:#EA4C89" class="bars__item"></li>
|
||
|
|
<li style="background-color:#AD29B6" class="bars__item"></li>
|
||
|
|
<li style="background-color:#440099" class="bars__item"></li>
|
||
|
|
<li style="background-color:#6441A5" class="bars__item"></li>
|
||
|
|
<li style="background-color:#999999" class="bars__item"></li>
|
||
|
|
<li style="background-color:#757575" class="bars__item"></li>
|
||
|
|
<li style="background-color:#3A393C" class="bars__item"></li>
|
||
|
|
<li style="background-color:#181717" class="bars__item"></li>
|
||
|
|
<li style="background-color:#030303" class="bars__item"></li>
|
||
|
|
<li style="background-color:#000000" class="bars__item"></li>
|
||
|
|
<li style="background-color:#000000" class="bars__item"></li>
|
||
|
|
<li style="background-color:#000000" class="bars__item"></li>
|
||
|
|
<li style="background-color:#000000" class="bars__item"></li>
|
||
|
|
<li style="background-color:#000000" class="bars__item"></li>
|
||
|
|
<li style="background-color:#000000" class="bars__item"></li>
|
||
|
|
</ul>
|
||
|
|
<h1 class="title">Simple Icons</h1>
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
</html>
|