Miko/webicons
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added Instagram.

Browse Source
This commit is contained in:
Adam Fairhead
2012-09-21 15:25:20 -04:00
parent 4679f3be2c
commit 0525d616cd
6 changed files with 178 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
fc-webicons.css
View File

@@ -71,6 +71,12 @@
.no-svg .fc-webicon.icloud.small { background: url("images/fc-webicon-icloud-s.png"); }
.svg .fc-webicon.icloud { background: url("images/fc-webicon-icloud.svg"); }
/* Instagram */
.no-svg .fc-webicon.instagram { background: url("images/fc-webicon-instagram-m.png"); }
.no-svg .fc-webicon.instagram.large { background: url("images/fc-webicon-instagram.png"); }
.no-svg .fc-webicon.instagram.small { background: url("images/fc-webicon-instagram-s.png"); }
.svg .fc-webicon.instagram { background: url("images/fc-webicon-instagram.svg"); }
/* Last.fm */
.no-svg .fc-webicon.lastfm { background: url("images/fc-webicon-lastfm-m.png"); }
.no-svg .fc-webicon.lastfm.large { background: url("images/fc-webicon-lastfm.png"); }

6
fc-webicons.html
View File

@@ -46,6 +46,8 @@
<a class="fc-webicon icloud small" href="#">iCloud</a>
<a class="fc-webicon instagram small" href="#">Instagram</a>
<a class="fc-webicon lastfm small" href="#">Last.fm</a>
<a class="fc-webicon linkedin small" href="#">LinkedIn</a>
@@ -110,6 +112,8 @@
<a class="fc-webicon icloud" href="#">iCloud</a>
<a class="fc-webicon instagram" href="#">Instagram</a>
<a class="fc-webicon lastfm" href="#">Last.fm</a>
<a class="fc-webicon linkedin" href="#">LinkedIn</a>
@@ -174,6 +178,8 @@
<a class="fc-webicon icloud large" href="#">iCloud</a>
<a class="fc-webicon instagram large" href="#">Instagram</a>
<a class="fc-webicon lastfm large" href="#">Last.fm</a>
<a class="fc-webicon linkedin large" href="#">LinkedIn</a>

BIN
images/fc-webicon-instagram-m.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
images/fc-webicon-instagram-s.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 951 B

BIN
images/fc-webicon-instagram.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

166
images/fc-webicon-instagram.svg Normal file
View File

@@ -0,0 +1,166 @@
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="456 256 48 48" enable-background="new 456 256 48 48" xml:space="preserve">
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="351.3662" y1="312.875" x2="351.3662" y2="301.375" gradientTransform="matrix(4.1667 0 0 -4.1667 -983.9935 1559.6541)">
<stop offset="0" style="stop-color:#F6F8F3"/>
<stop offset="0.1399" style="stop-color:#F2F4EF"/>
<stop offset="0.2928" style="stop-color:#E8E7E1"/>
<stop offset="0.4519" style="stop-color:#D7D2CC"/>
<stop offset="0.6152" style="stop-color:#BEB4AD"/>
<stop offset="0.7818" style="stop-color:#9F8E86"/>
<stop offset="0.9489" style="stop-color:#796156"/>
<stop offset="1" style="stop-color:#6C5146"/>
</linearGradient>
<path fill="url(#SVGID_1_)" d="M504,297.928c0,3.307-2.683,5.989-5.989,5.989h-35.938c-3.308,0-5.99-2.683-5.99-5.989V261.99
c0-3.307,2.682-5.99,5.99-5.99h35.938c3.307,0,5.989,2.683,5.989,5.99V297.928z"/>
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="351.3462" y1="312.875" x2="351.3462" y2="309.293" gradientTransform="matrix(4.1667 0 0 -4.1667 -983.9935 1559.6541)">
<stop offset="0" style="stop-color:#A36F59"/>
<stop offset="1" style="stop-color:#63362C"/>
</linearGradient>
<path fill="url(#SVGID_2_)" d="M503.916,270.928v-8.938c0-3.307-2.682-5.99-5.988-5.99H461.99c-3.308,0-5.99,2.683-5.99,5.99v8.938
H503.916z"/>
<g id="FiFizv_1_">
<image overflow="visible" width="144" height="144" id="FiFizv" xlink:href="19C10E8D56B22E12.jpg" transform="matrix(1 0 0 1 759 934)">
</image>
</g>
<g>
<circle opacity="0.75" fill="#372D24" cx="480.062" cy="280.812" r="13.688"/>
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="480.062" y1="266.625" x2="480.062" y2="293.0005">
<stop offset="0" style="stop-color:#E0E0E0"/>
<stop offset="1" style="stop-color:#948888"/>
</linearGradient>
<circle fill="url(#SVGID_3_)" cx="480.062" cy="279.812" r="13.188"/>
<circle fill="#0F0B0A" cx="480.062" cy="279.812" r="11.438"/>
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="480.063" y1="290.625" x2="480.063" y2="269.0005">
<stop offset="0" style="stop-color:#476364"/>
<stop offset="1" style="stop-color:#111214"/>
</linearGradient>
<circle fill="url(#SVGID_4_)" cx="480.062" cy="279.812" r="10.812"/>
<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="480.062" y1="271.625" x2="480.062" y2="288.0005">
<stop offset="0" style="stop-color:#2C424D"/>
<stop offset="1" style="stop-color:#2A2F33"/>
</linearGradient>
<circle fill="url(#SVGID_5_)" cx="480.062" cy="279.812" r="8.188"/>
<circle fill="#16201F" cx="480.062" cy="279.812" r="5.438"/>
<circle fill="#293332" cx="480.062" cy="279.812" r="5.021"/>
<circle fill="#101615" cx="480.062" cy="279.812" r="4.542"/>
<circle opacity="0.4" fill="#49405D" cx="480.062" cy="276.75" r="3.688"/>
<circle opacity="0.4" fill="#49405D" cx="480.062" cy="277.75" r="2.625"/>
<circle opacity="0.5" fill="#49405D" cx="480.125" cy="278.312" r="1.969"/>
<circle opacity="0.06" fill="#76AFCD" cx="480.062" cy="273.5" r="4.5"/>
<circle opacity="0.07" fill="#76AFCD" cx="480.062" cy="272.5" r="3.5"/>
<circle opacity="0.06" fill="#76AFCD" cx="480.031" cy="273.031" r="3.969"/>
<circle opacity="0.06" fill="#76AFCD" cx="480.062" cy="272.094" r="3.094"/>
<circle opacity="0.06" fill="#76AFCD" cx="480.094" cy="271.531" r="2.531"/>
<circle opacity="0.06" fill="#76AFCD" cx="480.078" cy="271.016" r="1.953"/>
<circle opacity="0.06" fill="#76AFCD" cx="480.094" cy="270.531" r="1.531"/>
<ellipse transform="matrix(-0.4997 0.8662 -0.8662 -0.4997 973.0029 3.2513)" opacity="0.06" fill="#76AF9F" cx="485.562" cy="282.625" rx="6.25" ry="4.5"/>
<ellipse transform="matrix(-0.4996 0.8663 -0.8663 -0.4996 973.7116 3.1675)" opacity="0.06" fill="#76AF9F" cx="485.941" cy="282.826" rx="5.656" ry="4.071"/>
<ellipse transform="matrix(-0.4996 0.8662 -0.8662 -0.4996 974.7131 3.2125)" opacity="0.06" fill="#76AF9F" cx="486.429" cy="283.125" rx="4.861" ry="3.5"/>
<ellipse transform="matrix(-0.4997 0.8662 -0.8662 -0.4997 975.5553 3.1931)" opacity="0.06" fill="#76AF9F" cx="486.855" cy="283.34" rx="4.198" ry="3.022"/>
<ellipse transform="matrix(-0.4997 0.8662 -0.8662 -0.4997 976.4149 3.3289)" opacity="0.06" fill="#76AF9F" cx="487.246" cy="283.646" rx="3.516" ry="2.531"/>
<ellipse transform="matrix(-0.4997 0.8662 -0.8662 -0.4997 977.2089 3.3984)" opacity="0.06" fill="#76AF9F" cx="487.623" cy="283.894" rx="2.89" ry="2.081"/>
<ellipse transform="matrix(-0.4997 0.8662 -0.8662 -0.4997 978.1479 3.33)" opacity="0.06" fill="#76AF9F" cx="488.112" cy="284.146" rx="2.126" ry="1.531"/>
<ellipse transform="matrix(-1 -0.0013 0.0013 -1 959.1182 575.011)" opacity="0.07" fill="#568CC7" cx="479.75" cy="287.187" rx="6.25" ry="3"/>
<ellipse transform="matrix(-1 -0.0011 0.0011 -1 959.2017 575.603)" opacity="0.07" fill="#568CC7" cx="479.766" cy="287.527" rx="5.543" ry="2.66"/>
<ellipse transform="matrix(-1 -0.0012 0.0012 -1 959.1517 576.287)" opacity="0.07" fill="#568CC7" cx="479.75" cy="287.854" rx="4.861" ry="2.333"/>
<ellipse transform="matrix(-1 -0.0013 0.0013 -1 959.0359 577.0235)" opacity="0.07" fill="#568CC7" cx="479.705" cy="288.201" rx="4.14" ry="1.989"/>
<ellipse opacity="0.07" fill="#568CC7" cx="479.705" cy="288.5" rx="3.516" ry="1.688"/>
<path opacity="0.07" fill="#568CC7" d="M477.078,288.854c0-0.734,1.242-1.33,2.773-1.326c1.532,0.002,2.77,0.6,2.769,1.334
c0,0.734-1.243,1.329-2.771,1.328C478.315,290.186,477.077,289.588,477.078,288.854z"/>
<ellipse opacity="0.07" fill="#568CC7" cx="479.704" cy="289.167" rx="2.126" ry="1.021"/>
<circle fill="#665778" cx="480.094" cy="279.906" r="0.719"/>
</g>
<path fill="#815F55" d="M501.062,267.125c0,1.104-0.896,2-2,2H493.5c-1.104,0-2-0.896-2-2v-5.438c0-1.104,0.896-2,2-2h5.562
c1.104,0,2,0.896,2,2V267.125z"/>
<g>
<path fill="#070200" d="M501.062,266.562c0,1.104-0.896,2-2,2H493.5c-1.104,0-2-0.896-2-2v-5.438c0-1.104,0.896-2,2-2h5.562
c1.104,0,2,0.896,2,2V266.562z"/>
<path fill="#192123" d="M500.562,266.278c0,0.989-0.802,1.791-1.791,1.791h-4.98c-0.989,0-1.791-0.802-1.791-1.791v-4.869
c0-0.989,0.802-1.791,1.791-1.791h4.98c0.989,0,1.791,0.802,1.791,1.791V266.278z"/>
<linearGradient id="SVGID_6_" gradientUnits="userSpaceOnUse" x1="493.2061" y1="260.769" x2="499.3566" y2="266.9196">
<stop offset="0" style="stop-color:#061115"/>
<stop offset="0.2084" style="stop-color:#0B181B"/>
<stop offset="0.5044" style="stop-color:#192A2A"/>
<stop offset="0.8512" style="stop-color:#2F4943"/>
<stop offset="1" style="stop-color:#3A5850"/>
</linearGradient>
<path fill="url(#SVGID_6_)" d="M499.812,265.852c0,0.816-0.661,1.477-1.478,1.477h-4.107c-0.816,0-1.478-0.661-1.478-1.477v-4.016
c0-0.815,0.661-1.477,1.478-1.477h4.107c0.816,0,1.478,0.661,1.478,1.477V265.852z"/>
<circle fill="#180D13" cx="496.344" cy="263.844" r="2.656"/>
<linearGradient id="SVGID_7_" gradientUnits="userSpaceOnUse" x1="496.3438" y1="266.125" x2="496.3438" y2="261.5625">
<stop offset="0" style="stop-color:#302536"/>
<stop offset="0.4825" style="stop-color:#2B283D"/>
<stop offset="1" style="stop-color:#212F4A"/>
</linearGradient>
<circle fill="url(#SVGID_7_)" cx="496.344" cy="263.844" r="2.281"/>
<circle opacity="0.25" fill="#FFFFFF" cx="497.417" cy="262.25" r="0.541"/>
<circle opacity="0.25" fill="#FFFFFF" cx="498.25" cy="262.833" r="0.416"/>
</g>
<linearGradient id="SVGID_8_" gradientUnits="userSpaceOnUse" x1="460.4751" y1="270.9277" x2="460.4751" y2="256.0073">
<stop offset="0" style="stop-color:#822C37"/>
<stop offset="0.0042" style="stop-color:#872C38"/>
<stop offset="0.0349" style="stop-color:#A62D3F"/>
<stop offset="0.0697" style="stop-color:#C22F45"/>
<stop offset="0.109" style="stop-color:#D82F4A"/>
<stop offset="0.155" style="stop-color:#E9304E"/>
<stop offset="0.2117" style="stop-color:#F43150"/>
<stop offset="0.2914" style="stop-color:#FB3152"/>
<stop offset="0.5124" style="stop-color:#FD3152"/>
<stop offset="0.7066" style="stop-color:#C62F46"/>
<stop offset="0.901" style="stop-color:#952D3B"/>
<stop offset="0.9974" style="stop-color:#822C37"/>
</linearGradient>
<path fill="url(#SVGID_8_)" d="M461.702,256.007c-0.881,0.041-1.713,0.273-2.454,0.656v14.264h2.454V256.007z"/>
<linearGradient id="SVGID_9_" gradientUnits="userSpaceOnUse" x1="462.9062" y1="270.9375" x2="462.9062" y2="256">
<stop offset="0" style="stop-color:#A06A2A"/>
<stop offset="0.0133" style="stop-color:#A9762C"/>
<stop offset="0.0491" style="stop-color:#BE9131"/>
<stop offset="0.0902" style="stop-color:#CEA736"/>
<stop offset="0.1383" style="stop-color:#DBB839"/>
<stop offset="0.1977" style="stop-color:#E4C33B"/>
<stop offset="0.281" style="stop-color:#EACA3D"/>
<stop offset="0.5124" style="stop-color:#EBCC3D"/>
<stop offset="0.6432" style="stop-color:#D4AE37"/>
<stop offset="0.8801" style="stop-color:#AF7D2E"/>
<stop offset="0.9974" style="stop-color:#A06A2A"/>
</linearGradient>
<rect x="461.672" y="256" fill="url(#SVGID_9_)" width="2.469" height="14.938"/>
<linearGradient id="SVGID_10_" gradientUnits="userSpaceOnUse" x1="465.3643" y1="270.9375" x2="465.3643" y2="256">
<stop offset="0" style="stop-color:#3C694A"/>
<stop offset="0.0091" style="stop-color:#407150"/>
<stop offset="0.0452" style="stop-color:#4D8C65"/>
<stop offset="0.0867" style="stop-color:#58A275"/>
<stop offset="0.1351" style="stop-color:#60B382"/>
<stop offset="0.1951" style="stop-color:#66BE8B"/>
<stop offset="0.2791" style="stop-color:#69C591"/>
<stop offset="0.5124" style="stop-color:#6AC792"/>
<stop offset="0.6302" style="stop-color:#5DAD7E"/>
<stop offset="0.8758" style="stop-color:#457C59"/>
<stop offset="0.9974" style="stop-color:#3C694A"/>
</linearGradient>
<rect x="464.13" y="256" fill="url(#SVGID_10_)" width="2.469" height="14.938"/>
<linearGradient id="SVGID_11_" gradientUnits="userSpaceOnUse" x1="467.8232" y1="270.9375" x2="467.8232" y2="256">
<stop offset="0" style="stop-color:#2456D3"/>
<stop offset="0.0235" style="stop-color:#2B60DC"/>
<stop offset="0.0788" style="stop-color:#3871EB"/>
<stop offset="0.1476" style="stop-color:#417CF6"/>
<stop offset="0.2442" style="stop-color:#4683FC"/>
<stop offset="0.5124" style="stop-color:#4785FE"/>
<stop offset="0.7758" style="stop-color:#3269E4"/>
<stop offset="0.9974" style="stop-color:#2456D3"/>
</linearGradient>
<rect x="466.589" y="256" fill="url(#SVGID_11_)" width="2.469" height="14.938"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB