Skip to content

Instantly share code, notes, and snippets.

@thijzert thijzert/button.css
Last active Oct 14, 2016

Embed
What would you like to do?
Scriptless fork button
#fork-me a
{
background-color: #eee;
background-image: -webkit-linear-gradient(top,#fcfcfc,#eee);
background-image: -moz-linear-gradient(top,#fcfcfc,#eee);
background-image: linear-gradient(to bottom,#fcfcfc,#eee);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc', endColorstr='#eeeeee')";
height: 26px;
display: inline-block;
padding: 0 10px 0 6px;
vertical-align: middle;
cursor: pointer;
border: 1px solid #d5d5d5;
border-radius: 3px;
color: #333;
font-size: 13px;
line-height: 26px;
font-weight: bold;
font-family: sans-serif;
text-decoration: none;
}
#fork-me a img
{
max-height: 20px;
vertical-align: middle;
margin-right: 4px;
}
#fork-me a:hover
{
background-color: #ddd;
background-image: -webkit-linear-gradient(top,#eee,#ddd);
background-image: -moz-linear-gradient(top,#eee,#ddd);
background-image: linear-gradient(to bottom,#eee,#ddd);
border-color: #ccc;
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd')";
}
<div id="fork-me"><a href="https://github.com/torvalds/kernel"><img src='data:image/svg+xml;UTF-8,<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="300" width="220" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 220 300"><g transform="translate(0 -752)"><path d="m207 812c-1.79 7.4-7.54 15.8-13.2 19.3-2.04 1.26-2.09 1.39-2.09 5.59 0 6.97-1.26 16.7-3.12 24-4.28 16.9-12.9 31-29.7 48.4-14.7 15.2-19.1 20.2-22.7 25.6-6.28 9.39-8.93 17.6-9.8 30.4l-0.429 6.32 2.83 1.95c3.29 2.26 7.26 6.61 9.45 10.3 6.02 10.3 5.65 24.2-0.901 34-12.7 19.1-39.4 20-53.2 1.81-8.04-10.6-8.79-24.8-1.93-36.5 2.01-3.43 8.36-9.92 10.3-10.5 1.28-0.405 1.31-0.677 0.968-8.32-0.404-9.06-1.9-15.7-5.1-22.4-3.8-8-8-13-25.3-31-11.8-12-17.3-19-22.2-27-7.54-12.7-11.7-28-11.7-43.2-0.0037-6.56-0.0104-6.59-1.77-7.63-5.42-3.2-11.4-11.4-13.5-18.6-1.29-4.41-1.29-13.2 0-17.6 2.94-9.99 10.5-18.2 20.2-21.9 4.83-1.84 13.5-2.29 18.6-0.968 17.6 4.51 28.3 21.7 24.2 39-1.82 7.71-7.45 16-13.3 19.6l-2.17 1.34 0.354 7.55c0.617 13.1 4.04 22.4 12.3 33.2 2.37 3.09 9.82 11.4 16.6 18.4 6.74 7 14 15.1 16.2 18l3.95 5.24 4.37-5.47c2.41-3.01 8.9-10.2 14.4-16 5.54-5.77 11.8-12.5 13.9-15 10.5-12.2 15-23.4 15.9-39.2l0.365-6.57-1.84-1.06c-3.1-1.79-8.71-7.9-10.7-11.6-2.8-5.28-3.87-9.65-3.87-15.7 0-9.5 3.17-16.9 9.96-23.3 6.86-6.45 13.5-9.21 22.2-9.21 21 0 36.8 19.8 31.8 40.1zm-14-16c-3.27-6.76-8.82-10.4-16.6-10.8-4.53-0.249-5.49-0.0963-8.75 1.39-2.01 0.92-4.46 2.43-5.45 3.36-12.5 11.8-5.22 32.6 11.8 33.7 9.31 0.597 17.2-4.62 20-13.2 1.25-3.83 0.76-10.8-1.03-14.5zm-65 197c-1.68-3.82-6.29-8.4-10.2-10.2-2.44-1.09-4.27-1.41-7.87-1.38-5.88 0.0551-9.53 1.58-13.7 5.73-11.6 11.6-4.18 31.6 12.3 33.1 14.5 1.31 25.3-13.9 19.4-27.3zm-65.7-197c-3.31-6.83-8.92-10.5-16.7-10.9-4.53-0.249-5.48-0.0944-8.9 1.44-15.2 6.83-15.6 27.7-0.585 35.4 3.35 1.71 10 2.28 13.9 1.18 5.66-1.58 11.4-7.06 13.2-12.7 1.24-3.79 0.778-10.8-0.946-14.4z"/></g></svg>' />Fork me on GitHub</a></div>
// This button does not use any javascript.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.