Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Links
/**
* Links
*/
body {
background: #FFDEDB;
}
a {
display: inline-block;
padding: .3em 1em;
background: #e2887a;
background-image: linear-gradient(300deg, #FFDEDB .5em, hsla(5, 100%, 93%, 0) .6em),
linear-gradient(240deg, #FFDEDB .5em, hsla(5, 100%, 93%, 0) .6em),
linear-gradient(60deg, #FFDEDB .5em, hsla(5, 100%, 93%, 0) .6em),
linear-gradient(120deg, #FFDEDB .5em, hsla(5, 100%, 93%, 0) .6em);
background-position: bottom right, top right, top left, bottom left;
background-size: 1.5em 50%;
background-repeat: no-repeat;
color: white;
}
a:hover {
background-color: #973a2c;
}
<a>foo bar</a>
<a>FOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO</a>
<a>foo</a>
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment