Skip to content

Instantly share code, notes, and snippets.

@mobz

mobz/melbjs.html

Created November 10, 2011 02:47
Show Gist options
  • Save mobz/1353964 to your computer and use it in GitHub Desktop.
Save mobz/1353964 to your computer and use it in GitHub Desktop.
Download ZIP
melbjs logo in css
Raw
melbjs.html
<!DOCTYPE html>
<html>
<head>
<title>MelbJS</title>
<style>
.melbjs-logo {
width: 300px;
height: 300px;
background: rgb( 67, 122, 198);
font-family: HeadlineA, sans-serif;
color: white;
text-transform: uppercase;
text-align: center;
border: 1px solid rgba( 255, 255, 255, 0.5);
}
.melbjs-logo > DIV {
position: relative;
color: transparent;
}
.melbjs-logo > DIV > SPAN {
position: absolute;
top: 0; left: 0;
width: 100%;
}
.melbjs-logo > DIV:first-child {
height: 40%;
font-size: 127px;
background: -webkit-linear-gradient(45deg, #4388d3, #63aeed);
}
.melbjs-logo > DIV:last-child {
-webkit-background-clip: text;
font-size: 200px;
line-height: 200px;
}
.melbjs-logo > DIV > SPAN:first-child {
text-shadow: 2px 2px 2px rgba( 0, 0, 0, 0.3);
}
.melbjs-logo > DIV > SPAN:last-child {
-webkit-background-clip: text;
background-image: -webkit-linear-gradient(top, #fff 30%, #bbb 90%);
}
.melbjs-logo > DIV:last-child > SPAN {
-webkit-transform: scale(1.14, 1);
text-indent: -3px;
}
</style>
</head>
<body>
<div class="melbjs-logo"><div><span>Melb</span><span>Melb</span></div><div><span>JS</span><span>JS</span></div></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment