Skip to content

Instantly share code, notes, and snippets.

@schadeck
Created October 4, 2012 15:56
Show Gist options
  • Save schadeck/3834572 to your computer and use it in GitHub Desktop.
Save schadeck/3834572 to your computer and use it in GitHub Desktop.
CSS3 Space Invader
/**
* CSS3 Space Invader
*/
body { width: 200px; margin: 100px auto; }
#space-invader{
box-shadow:
0 0 0 1em#000,
0 1em 0 1em#000,
-2.5em 1.5em 0 .5em#000,
2.5em 1.5em 0 .5em#000,
-3em -3em 0 0#000,
3em -3em 0 0#000,
-2em -2em 0 0#000,
2em -2em 0 0#000,
-3em -1em 0 0#000,
-2em -1em 0 0#000,
2em -1em 0 0#000,
3em -1em 0 0#000,
-4em 0 0 0#000,
-3em 0 0 0#000,
3em 0 0 0#000,
4em 0 0 0#000,
-5em 1em 0 0#000,
-4em 1em 0 0#000,
4em 1em 0 0#000,
5em 1em 0 0#000,
-5em 2em 0 0#000,
5em 2em 0 0#000,
-5em 3em 0 0#000,
-3em 3em 0 0#000,
3em 3em 0 0#000,
5em 3em 0 0#000,
-2em 4em 0 0#000,
-1em 4em 0 0#000,
1em 4em 0 0#000,
2em 4em 0 0#000;
background: #000;
width: 1em;
height: 1em;
overflow: hidden;
margin: 50px 0 70px 65px;
}
<!-- content to be placed inside <body>…</body> -->
<div id="space-invader"></div>
{"view":"split-vertical","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