Skip to content

Instantly share code, notes, and snippets.

@freshyill
Created November 20, 2012 23:18
Show Gist options
  • Save freshyill/4121932 to your computer and use it in GitHub Desktop.
Save freshyill/4121932 to your computer and use it in GitHub Desktop.
Mario in CSS
<!doctype html>
<html>
<head>
<style>
body {padding: 100px;}
.mario {
-moz-transform: scale(20);
-webkit-transform: scale(20);
transform: scale(20);
width: 1px;
height: 1px;
margin: 0 auto; display: block;
box-shadow:
3px 0px 0 #97050c,
4px 0px 0 #97050c,
5px 0px 0 #97050c,
6px 0px 0 #97050c,
7px 0px 0 #97050c,
8px 0px 0 #97050c,
2px 1px 0 #97050c,
3px 1px 0 #97050c,
4px 1px 0 #97050c,
5px 1px 0 #97050c,
6px 1px 0 #97050c,
7px 1px 0 #97050c,
8px 1px 0 #97050c,
9px 1px 0 #97050c,
10px 1px 0 #97050c,
11px 1px 0 #97050c,
2px 2px 0 #653308,
3px 2px 0 #653308,
4px 2px 0 #653308,
5px 2px 0 #653308,
6px 2px 0 #fd986a,
7px 2px 0 #fd986a,
8px 2px 0 #653308,
9px 2px 0 #fd986a,
1px 3px 0 #653308,
2px 3px 0 #653308,
3px 3px 0 #fd986a,
4px 3px 0 #653308,
5px 3px 0 #fd986a,
6px 3px 0 #fd986a,
7px 3px 0 #fd986a,
8px 3px 0 #653308,
9px 3px 0 #fd986a,
10px 3px 0 #fd986a,
11px 3px 0 #fd986a,
1px 4px 0 #653308,
2px 4px 0 #653308,
3px 4px 0 #fd986a,
4px 4px 0 #653308,
5px 4px 0 #653308,
6px 4px 0 #fd986a,
7px 4px 0 #fd986a,
8px 4px 0 #fd986a,
9px 4px 0 #653308,
10px 4px 0 #fd986a,
11px 4px 0 #fd986a,
12px 4px 0 #fd986a,
1px 5px 0 #653308,
2px 5px 0 #653308,
3px 5px 0 #653308,
4px 5px 0 #fd986a,
5px 5px 0 #fd986a,
6px 5px 0 #fd986a,
7px 5px 0 #fd986a,
8px 5px 0 #653308,
9px 5px 0 #653308,
10px 5px 0 #653308,
11px 5px 0 #653308,
3px 6px 0 #fd986a,
4px 6px 0 #fd986a,
5px 6px 0 #fd986a,
6px 6px 0 #fd986a,
7px 6px 0 #fd986a,
8px 6px 0 #fd986a,
9px 6px 0 #fd986a,
10px 6px 0 #fd986a,
2px 7px 0 #653308,
3px 7px 0 #653308,
4px 7px 0 #653308,
5px 7px 0 #97050c,
6px 7px 0 #653308,
7px 7px 0 #653308,
8px 7px 0 #653308,
1px 8px 0 #653308,
2px 8px 0 #653308,
3px 8px 0 #653308,
4px 8px 0 #653308,
5px 8px 0 #97050c,
6px 8px 0 #653308,
7px 8px 0 #653308,
8px 8px 0 #97050c,
9px 8px 0 #653308,
10px 8px 0 #653308,
11px 8px 0 #653308,
0px 9px 0 #653308,
1px 9px 0 #653308,
2px 9px 0 #653308,
3px 9px 0 #653308,
4px 9px 0 #653308,
5px 9px 0 #97050c,
6px 9px 0 #97050c,
7px 9px 0 #97050c,
8px 9px 0 #97050c,
9px 9px 0 #653308,
10px 9px 0 #653308,
11px 9px 0 #653308,
12px 9px 0 #653308,
0px 10px 0 #fd986a,
1px 10px 0 #fd986a,
2px 10px 0 #fd986a,
3px 10px 0 #653308,
4px 10px 0 #97050c,
5px 10px 0 #fd986a,
6px 10px 0 #97050c,
7px 10px 0 #97050c,
8px 10px 0 #fd986a,
9px 10px 0 #97050c,
10px 10px 0 #653308,
11px 10px 0 #fd986a,
12px 10px 0 #fd986a,
0px 11px 0 #fd986a,
1px 11px 0 #fd986a,
2px 11px 0 #fd986a,
3px 11px 0 #fd986a,
4px 11px 0 #97050c,
5px 11px 0 #97050c,
6px 11px 0 #97050c,
7px 11px 0 #97050c,
8px 11px 0 #97050c,
9px 11px 0 #97050c,
10px 11px 0 #fd986a,
11px 11px 0 #fd986a,
12px 11px 0 #fd986a,
0px 12px 0 #fd986a,
1px 12px 0 #fd986a,
2px 12px 0 #fd986a,
3px 12px 0 #97050c,
4px 12px 0 #97050c,
5px 12px 0 #97050c,
6px 12px 0 #97050c,
7px 12px 0 #97050c,
8px 12px 0 #97050c,
9px 12px 0 #97050c,
10px 12px 0 #97050c,
11px 12px 0 #fd986a,
12px 12px 0 #fd986a,
2px 13px 0 #97050c,
3px 13px 0 #97050c,
4px 13px 0 #97050c,
5px 13px 0 #97050c,
7px 13px 0 #97050c,
8px 13px 0 #97050c,
9px 13px 0 #97050c,
10px 13px 0 #97050c,
1px 14px 0 #653308,
2px 14px 0 #653308,
3px 14px 0 #653308,
4px 14px 0 #653308,
8px 14px 0 #653308,
9px 14px 0 #653308,
10px 14px 0 #653308,
11px 14px 0 #653308,
0px 15px 0 #653308,
1px 15px 0 #653308,
2px 15px 0 #653308,
3px 15px 0 #653308,
4px 15px 0 #653308,
8px 15px 0 #653308,
9px 15px 0 #653308,
10px 15px 0 #653308,
11px 15px 0 #653308,
12px 15px 0 #653308;
}
</style>
</head>
<body>
<div class="mario"></div>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment