Created
April 3, 2013 10:00
-
-
Save samarkandiy/5299928 to your computer and use it in GitHub Desktop.
A CodePen by Avaz Bokiev. Creative Circle logo using CSS
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="cc">creativecircle</div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @import url(http://fonts.googleapis.com/css?family=Comfortaa); | |
| body{ | |
| background: #EF3E42; | |
| padding: 30px; | |
| } | |
| .cc{ | |
| background: #fff; | |
| color: #fff; | |
| font-size: 11px; | |
| font-family: 'Comfortaa'; | |
| font-weight: bold; | |
| line-height: 380px; | |
| width: 20px; | |
| height: 20px; | |
| border-radius: 20px; | |
| box-shadow: | |
| 0 150px 0 0 rgba(255, 255, 255, 1), | |
| -75px 75px 0 0 rgba(255, 255, 255, 1), | |
| 75px 75px 0 0 rgba(255, 255, 255, .2), | |
| 37px 10px 0 0 rgba(255, 255, 255, 1), | |
| -37px 10px 0 0 rgba(255, 255, 255, 1), | |
| -37px 140px 0 0 rgba(255, 255, 255, 1), | |
| 37px 140px 0 0 rgba(255, 255, 255, 1), | |
| -65px 37px 0 0 rgba(255, 255, 255, 1), | |
| 65px 37px 0 0 rgba(255, 255, 255, .2), | |
| 65px 114px 0 0 rgba(255, 255, 255, .2), | |
| -65px 114px 0 0 rgba(255, 255, 255, 1), | |
| 0 25px 0 -2px rgba(255, 255, 255, 1), | |
| 0 125px 0 -2px rgba(255, 255, 255, 1), | |
| -51px 75px 0 -2px rgba(255, 255, 255, 1), | |
| 51px 75px 0 -2px rgba(255, 255, 255, .2), | |
| 0px 75px 0 -7px rgba(255, 255, 255, .2), | |
| 24px 32px 0 -2px rgba(255, 255, 255, 1), | |
| -24px 32px 0 -2px rgba(255, 255, 255, 1), | |
| -24px 119px 0 -2px rgba(255, 255, 255, 1), | |
| 24px 119px 0 -2px rgba(255, 255, 255, 1), | |
| -43px 50px 0 -2px rgba(255, 255, 255, 1), | |
| 43px 50px 0 -2px rgba(255, 255, 255, .2), | |
| -43px 100px 0 -2px rgba(255, 255, 255, 1), | |
| 43px 100px 0 -2px rgba(255, 255, 255, .2), | |
| 0 51px 0 -4px rgba(255, 255, 255, .2), | |
| 0 100px 0 -4px rgba(255, 255, 255, .2), | |
| 27px 76px 0 -4px rgba(255, 255, 255, .2), | |
| -27px 76px 0 -4px rgba(255, 255, 255, .2), | |
| -17px 59px 0 -4px rgba(255, 255, 255, .2), | |
| 17px 59px 0 -4px rgba(255, 255, 255, .2), | |
| -17px 91px 0 -4px rgba(255, 255, 255, .2), | |
| 17px 91px 0 -4px rgba(255, 255, 255, .2); | |
| margin: 0 auto; | |
| } | |
| .cc:hover{ | |
| width: 20px; | |
| height: 20px; | |
| transform: scale(2); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment