Skip to content

Instantly share code, notes, and snippets.

@wbrady

wbrady/one-div-logo.html

Last active December 11, 2015 06:48
Show Gist options
  • Save wbrady/4561851 to your computer and use it in GitHub Desktop.
Save wbrady/4561851 to your computer and use it in GitHub Desktop.
Download ZIP
Near Infinity logo using a single div and radial gradients
Raw
one-div-logo.html
<style type="text/css">
#logo {
font-size: 60px;
width: 4em;
height: 2em;
background: -webkit-radial-gradient(center, ellipse, rgba(255, 255, 255, 1) 40%,transparent 41%,transparent 100%),
-webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 1) 40%,transparent 41%,transparent 100%),
-webkit-radial-gradient(center, ellipse, rgba(255, 255, 255, 1) 40%,transparent 41%,transparent 100%),
-webkit-radial-gradient(center, ellipse, rgba(237, 128, 39, 1) 40%,transparent 41%,transparent 100%);
background-position: 0.3em 0.75em, -0.6em 0.35em, 1.4em 0.6em, 1.05em 0.15em;
background-repeat: no-repeat;
background-size: 1.7em 1.0em, 3em 1.9em, 1.7em 1.0em, 3em 1.9em;
}
</style>
<div id='logo'></div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment