Chris Slott cslott
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
| /** | |
| * Collapse Test | |
| */ | |
| background: #f06; | |
| background: linear-gradient(45deg, #f06, yellow); | |
| min-height: 100%; |
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
| /** | |
| * Previewer test | |
| */ | |
| background: #f06; | |
| background: linear-gradient(left bottom, | |
| hsla(340, 100%, 50%,.7), yellow); | |
| background: url(http://placekitten.com/330/340); | |
| content: '\2665'; | |
| min-width: 100px; |
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
| /** | |
| * Previewer test | |
| */ | |
| background: #f06; | |
| background: linear-gradient(left bottom, | |
| hsla(340, 100%, 50%,.7), yellow); | |
| background: url(http://placekitten.com/330/340); | |
| content: '\2665'; | |
| min-width: 100px; |
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
| background-color:silver; | |
| background-image: | |
| radial-gradient(100% 150%, circle, silver 24%, white 25%, white 28%, silver 29%, silver 36%, white 36%, white 40%, transparent 40%, transparent), | |
| radial-gradient(0 150%, circle, silver 24%, white 25%, white 28%, silver 29%, silver 36%, white 36%, white 40%, transparent 40%, transparent), | |
| radial-gradient(50% 100%, circle, white 10%, silver 11%, silver 23%, white 24%, white 30%, silver 31%, silver 43%, white 44%, white 50%, silver 51%, silver 63%, white 64%, white 71%, transparent 71%, transparent), | |
| radial-gradient(100% 50%, circle, white 5%, silver 6%, silver 15%, white 16%, white 20%, silver 21%, silver 30%, white 31%, white 35%, silver 36%, silver 45%, white 46%, white 49%, transparent 50%, transparent), | |
| radial-gradient(0 50%, circle, white 5%, silver 6%, silver 15%, white 16%, white 20%, silver 21%, silver 30%, white 31%, white 35%, silver 36%, silver 45%, white 46%, white 49%, transparent 50%, transparent); | |
| background-size:100px 50px; |
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
| background-color:silver; | |
| background-image: | |
| radial-gradient(100% 150%, circle, silver 24%, white 25%, white 28%, silver 29%, silver 36%, white 36%, white 40%, transparent 40%, transparent), | |
| radial-gradient(0 150%, circle, silver 24%, white 25%, white 28%, silver 29%, silver 36%, white 36%, white 40%, transparent 40%, transparent), | |
| radial-gradient(50% 100%, circle, white 10%, silver 11%, silver 23%, white 24%, white 30%, silver 31%, silver 43%, white 44%, white 50%, silver 51%, silver 63%, white 64%, white 71%, transparent 71%, transparent), | |
| radial-gradient(100% 50%, circle, white 5%, silver 6%, silver 15%, white 16%, white 20%, silver 21%, silver 30%, white 31%, white 35%, silver 36%, silver 45%, white 46%, white 49%, transparent 50%, transparent), | |
| radial-gradient(0 50%, circle, white 5%, silver 6%, silver 15%, white 16%, white 20%, silver 21%, silver 30%, white 31%, white 35%, silver 36%, silver 45%, white 46%, white 49%, transparent 50%, transparent); | |
| background-size:100px 50px; |
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
| /* Japanese cube pattern */ | |
| background-color:#556; | |
| background-image: linear-gradient(60deg, #445 12%, transparent 12.5%, transparent 87%, #445 87.5%, #445), | |
| linear-gradient(-60deg, #445 12%, transparent 12.5%, transparent 87%, #445 87.5%, #445), | |
| linear-gradient(60deg, #445 12%, transparent 12.5%, transparent 87%, #445 87.5%, #445), | |
| linear-gradient(-60deg, #445 12%, transparent 12.5%, transparent 87%, #445 87.5%, #445), | |
| linear-gradient(30deg, #99a 25%, transparent 25.5%, transparent 75%, #99a 75%, #99a), | |
| linear-gradient(30deg, #99a 25%, transparent 25.5%, transparent 75%, #99a 75%, #99a); | |
| background-size:80px 140px; |
cslott
/ dabblet.css
Created
April 17, 2013 00:39
— forked from LeaVerou/dabblet.css
Japanese cube pattern */
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
| /* Japanese cube pattern */ | |
| background-color:#556; | |
| background-image: linear-gradient(60deg, #445 12%, transparent 12.5%, transparent 87%, #445 87.5%, #445), | |
| linear-gradient(-60deg, #445 12%, transparent 12.5%, transparent 87%, #445 87.5%, #445), | |
| linear-gradient(60deg, #445 12%, transparent 12.5%, transparent 87%, #445 87.5%, #445), | |
| linear-gradient(-60deg, #445 12%, transparent 12.5%, transparent 87%, #445 87.5%, #445), | |
| linear-gradient(30deg, #99a 25%, transparent 25.5%, transparent 75%, #99a 75%, #99a), | |
| linear-gradient(30deg, #99a 25%, transparent 25.5%, transparent 75%, #99a 75%, #99a); | |
| background-size:80px 140px; |
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
| /** | |
| * Polka dot pattern | |
| */ | |
| background: radial-gradient(circle, white 10%, transparent 10%), | |
| radial-gradient(circle, white 10%, black 10%) 50px 50px; | |
| background-size:100px 100px; |
cslott
/ dabblet.css
Created
April 17, 2013 00:39
— forked from LeaVerou/dabblet.css
Polka dot pattern
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
| /** | |
| * Polka dot pattern | |
| */ | |
| background: radial-gradient(circle, white 10%, transparent 10%), | |
| radial-gradient(circle, white 10%, black 10%) 50px 50px; | |
| background-size:100px 100px; |
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
| /** | |
| * Checkerboard pattern | |
| * (a bit buggy in Webkit, see bug #54615) | |
| */ | |
| background-color: white; | |
| background-image: linear-gradient(45deg, black 25%, transparent 25%, transparent 75%, black 75%, black), | |
| linear-gradient(45deg, black 25%, transparent 25%, transparent 75%, black 75%, black); | |
| background-size:100px 100px; | |
| background-position: 0 0, 50px 50px; |
NewerOlder