CSS3 8位像素卡通图

8-Bit CSS Artwork. Unicorns & Narwals.

《three.js使用多个渐变torus模拟光环光晕》申请公开！

第三方库
作品简介 1780
作品推荐
使用帮助
常用链接

HTML
CSS
JavaScript
Result

编译

JavaScript

编译

CSS

.unicorn {
    width: 6px;
    height: 6px;
    background: transparent;
    box-shadow: 162px 54px #94d4ff, 156px 60px #94d4ff, 150px 66px #94d4ff, 144px 84px #94d4ff, 150px 84px #94d4ff, 150px 90px #94d4ff, 144px 90px #94d4ff, 138px 90px #94d4ff, 132px 90px #94d4ff, 132px 96px #94d4ff, 132px 102px #94d4ff, 132px 108px #94d4ff, 138px 108px #94d4ff, 138px 114px #94d4ff, 138px 120px #94d4ff, 138px 126px #94d4ff, 132px 126px #94d4ff, 144px 78px #94d4ff, 138px 78px #94d4ff, 132px 78px #94d4ff, 138px 84px #94d4ff, 126px 78px #94d4ff, 126px 84px #94d4ff, 126px 90px #94d4ff, 120px 72px #94d4ff, 120px 78px #94d4ff, 120px 84px #94d4ff, 108px 126px #94d4ff, 102px 126px #94d4ff, 96px 126px #94d4ff, 84px 132px #94d4ff, 78px 132px #94d4ff, 78px 138px #94d4ff, 78px 144px #94d4ff, 78px 150px #94d4ff, 78px 156px #94d4ff, 72px 156px #94d4ff, 72px 150px #94d4ff, 72px 144px #94d4ff, 72px 138px #94d4ff, 72px 132px #94d4ff, 126px 126px #94d4ff, 120px 126px #94d4ff, 114px 126px #94d4ff, 66px 126px #94d4ff, 66px 120px #94d4ff, 66px 114px #94d4ff, 66px 108px #94d4ff, 108px 108px #94d4ff, 114px 108px #94d4ff, 120px 108px #94d4ff, 102px 108px #94d4ff, 96px 108px #94d4ff, 96px 120px #94d4ff, 102px 114px #94d4ff, 132px 114px #94d4ff, 120px 114px #94d4ff, 108px 114px #94d4ff, 114px 114px #94d4ff, 126px 114px #94d4ff, 102px 120px #94d4ff, 108px 120px #94d4ff, 114px 120px #94d4ff, 120px 120px #94d4ff, 132px 120px #94d4ff, 96px 114px #94d4ff, 126px 120px #94d4ff, 60px 102px #94d4ff, 72px 102px #94d4ff, 72px 96px #94d4ff, 66px 90px #94d4ff, 66px 84px #94d4ff, 60px 84px #94d4ff, 54px 102px #1497e5, 48px 108px #1497e5, 42px 114px #1497e5, 36px 120px #1497e5, 30px 126px #1497e5, 144px 72px #fef8ac, 138px 72px #fef8ac, 132px 72px #fef8ac, 126px 72px #94d4ff, 144px 66px #f47027, 138px 66px #f47027, 132px 66px #f47027, 150px 72px #f47027, 144px 60px #fd383d, 138px 60px #fd383d, 132px 60px #fd383d, 126px 66px #fd383d, 114px 78px #fef8ac, 114px 84px #62bf48, 120px 90px #62bf48, 114px 90px #1397e5, 120px 96px #1397e5, 126px 96px #94d4ff, 126px 102px #1397e5, 114px 96px #711d7a, 120px 102px #711d7a, 126px 108px #711d7a, 132px 84px #0d0c09, 72px 84px #89c3f1, 72px 90px #89c3f1, 78px 96px #89c3f1, 78px 102px #89c3f1, 48px 102px #711d7a, 42px 108px #711d7a, 36px 114px #711d7a, 54px 108px #62bf48, 48px 114px #62bf48, 42px 120px #62bf48, 36px 126px #62bf48, 30px 132px #62bf48, 54px 114px #fef8ac, 48px 120px #fef8ac, 42px 126px #fef8ac, 54px 120px #fd383d, 48px 126px #f47027, 72px 108px #f1dc3f, 72px 114px #f1dc3f, 72px 126px #f1dc3f, 78px 114px #f1dc3f, 78px 108px #f1dc3f, 78px 120px #f1dc3f, 84px 120px #f1dc3f, 78px 126px #f1dc3f, 72px 120px #f1dc3f, 132px 132px #94d4ff, 126px 132px #94d4ff, 120px 132px #94d4ff, 126px 138px #94d4ff, 132px 138px #94d4ff, 126px 144px #94d4ff, 126px 150px #94d4ff, 132px 150px #94d4ff, 132px 144px #94d4ff, 126px 156px #94d4ff, 132px 156px #94d4ff, 90px 114px #f1dc3f, 84px 126px #f1dc3f, 90px 126px #f1dc3f, 90px 120px #f1dc3f, 84px 114px #f1dc3f, 84px 108px #f1dc3f, 90px 108px #f1dc3f;
}
.happy {
    width: 6px;
    height: 6px;
    margin-left: 200px;
    background: transparent;
    box-shadow: 114px 168px #bee10e, 96px 144px #bee10e, 72px 126px #bee10e, 108px 114px #bee10e, 54px 60px #bee10e, 48px 36px #bee10e, 60px 48px #bee10e, 30px 42px #bee10e, 36px 30px #bee10e, 24px 48px #03afce, 18px 54px #03afce, 90px 12px #03afce, 96px 30px #03afce, 102px 120px #03afce, 12px 132px #03afce, 42px 12px #aacff3, 48px 18px #aacff3, 30px 12px #aacff3, 12px 30px #aacff3, 114px 36px #aacff3, 126px 114px #aacff3, 108px 156px #aacff3, 90px 132px #aacff3, 60px 24px #aacff3, 66px 30px #aacff3, 72px 42px #aacff3, 84px 48px #aacff3, 90px 54px #aacff3, 78px 24px #03afce, 84px 18px #03afce, 18px 126px #03afce, 24px 120px #03afce, 36px 120px #03afce, 36px 132px #03afce, 36px 144px #03afce, 54px 132px #03afce, 48px 120px #03afce, 6px 72px #ff2998, 6px 96px #ff2998, 6px 102px #ff2998, 6px 90px #ff2998, 6px 84px #ff2998, 6px 78px #ff2998, 12px 90px #ff2998, 18px 90px #ff2998, 18px 96px #ff2998, 18px 102px #ff2998, 18px 84px #ff2998, 18px 78px #ff2998, 18px 72px #ff2998, 36px 72px #ff2998, 30px 78px #ff2998, 30px 84px #ff2998, 30px 90px #ff2998, 30px 102px #ff2998, 30px 96px #ff2998, 36px 90px #ff2998, 42px 90px #ff2998, 42px 84px #ff2998, 42px 78px #ff2998, 42px 96px #ff2998, 42px 102px #ff2998, 54px 102px #ff2998, 54px 96px #ff2998, 54px 90px #ff2998, 54px 84px #ff2998, 54px 78px #ff2998, 54px 72px #ff2998, 60px 72px #ff2998, 66px 72px #ff2998, 66px 78px #ff2998, 66px 90px #ff2998, 60px 90px #ff2998, 66px 84px #ff2998, 78px 90px #ff2998, 78px 84px #ff2998, 78px 78px #ff2998, 78px 72px #ff2998, 84px 72px #ff2998, 90px 72px #ff2998, 90px 78px #ff2998, 90px 84px #ff2998, 90px 90px #ff2998, 84px 90px #ff2998, 78px 102px #ff2998, 78px 96px #ff2998, 102px 72px #ff2998, 102px 78px #ff2998, 102px 84px #ff2998, 102px 90px #ff2998, 108px 90px #ff2998, 114px 90px #ff2998, 114px 84px #ff2998, 114px 78px #ff2998, 114px 72px #ff2998, 114px 96px #ff2998, 114px 102px #ff2998, 108px 102px #ff2998, 102px 102px #ff2998;
}
.new {
    margin-top: 4px;
    margin-left: 350px;
    width: 6px;
    height: 6px;
    background: transparent;
    box-shadow: 6px 60px #7087e4, 6px 66px #7087e4, 6px 72px #7087e4, 6px 78px #7087e4, 6px 84px #7087e4, 6px 90px #7087e4, 18px 156px #f5f304, 42px 120px #f5f304, 72px 30px #f5f304, 60px 42px #f5f304, 36px 12px #f5f304, 72px 12px #f5f304, 96px 108px #f5f304, 24px 24px #e78240, 12px 36px #e78240, 54px 36px #e78240, 66px 36px #e78240, 54px 18px #e78240, 84px 18px #e78240, 102px 12px #e78240, 36px 132px #e78240, 30px 144px #e78240, 54px 108px #e78240, 66px 24px #e42140, 66px 6px #e42140, 18px 12px #e42140, 12px 108px #e42140, 30px 36px #e42140, 24px 42px #e42140, 48px 30px #e42140, 96px 0px #e42140, 12px 72px #7087e4, 18px 78px #7087e4, 24px 78px #7087e4, 24px 72px #7087e4, 24px 66px #7087e4, 24px 60px #7087e4, 12px 66px #7087e4, 24px 84px #7087e4, 24px 90px #7087e4, 18px 84px #7087e4, 36px 60px #7087e4, 36px 66px #7087e4, 36px 72px #7087e4, 36px 84px #7087e4, 36px 78px #7087e4, 36px 90px #7087e4, 42px 90px #7087e4, 42px 60px #7087e4, 42px 72px #7087e4, 54px 60px #7087e4, 54px 66px #7087e4, 54px 72px #7087e4, 54px 78px #7087e4, 54px 84px #7087e4, 54px 90px #7087e4, 60px 84px #7087e4, 66px 78px #7087e4, 72px 84px #7087e4, 78px 90px #7087e4, 78px 84px #7087e4, 78px 78px #7087e4, 78px 72px #7087e4, 78px 66px #7087e4, 78px 60px #7087e4;
}
.year {
    margin-left: 460px;
    width: 6px;
    height: 6px;
    background: transparent;
    box-shadow: 6px 54px #ef8241, 6px 60px #ef8241, 6px 66px #ef8241, 12px 66px #ef8241, 18px 66px #ef8241, 18px 54px #ef8241, 18px 60px #ef8241, 18px 72px #ef8241, 18px 78px #ef8241, 30px 54px #ef8241, 30px 60px #ef8241, 30px 66px #ef8241, 30px 72px #ef8241, 30px 78px #ef8241, 36px 54px #ef8241, 36px 66px #ef8241, 48px 60px #ef8241, 48px 66px #ef8241, 48px 72px #ef8241, 48px 78px #ef8241, 48px 54px #ef8241, 54px 54px #ef8241, 60px 54px #ef8241, 60px 60px #ef8241, 60px 66px #ef8241, 60px 72px #ef8241, 60px 78px #ef8241, 54px 66px #ef8241, 72px 54px #ef8241, 72px 60px #ef8241, 72px 66px #ef8241, 72px 72px #ef8241, 72px 78px #ef8241, 78px 54px #ef8241, 84px 54px #ef8241, 84px 60px #ef8241, 84px 66px #ef8241, 78px 66px #ef8241, 84px 78px #ef8241, 78px 72px #ef8241, 48px 36px #9dc7f6, 72px 24px #9dc7f6, 108px 36px #9dc7f6, 108px 84px #9dc7f6, 36px 96px #9dc7f6, 24px 126px #9dc7f6, 12px 150px #9dc7f6, 24px 30px #9dc7f6, 30px 18px #9dc7f6, 24px 12px #9dc7f6, 6px 162px #cfef01, 18px 138px #cfef01, 30px 114px #cfef01, 66px 96px #cfef01, 96px 96px #cfef01, 108px 12px #cfef01, 96px 18px #cfef01, 66px 36px #cfef01, 54px 24px #cfef01, 60px 18px #cfef01, 72px 12px #cfef01, 18px 24px #cfef01, 12px 18px #cfef01, 12px 42px #cfef01, 96px 54px #cfef01, 84px 102px #00a1cb, 96px 72px #00a1cb, 42px 114px #00a1cb, 6px 96px #00a1cb, 84px 18px #00a1cb, 42px 30px #00a1cb, 84px 36px #00a1cb, 126px 12px #00a1cb, 108px 120px #00a1cb, 126px 66px #00a1cb, 18px 84px #ef8241, 12px 84px #ef8241, 6px 84px #ef8241, 30px 84px #ef8241, 36px 84px #ef8241, 48px 84px #ef8241, 60px 84px #ef8241, 72px 84px #ef8241, 84px 84px #ef8241;
}
.narwhal {
    margin-left: 580px;
    margin-top: -32px;
    width: 6px;
    height: 6px;
    background: transparent;
    box-shadow: 66px 120px #a1d3f0, 72px 108px #a1d3f0, 78px 102px #a1d3f0, 78px 108px #a1d3f0, 84px 120px #a1d3f0, 84px 102px #a1d3f0, 84px 96px #a1d3f0, 96px 90px #a1d3f0, 102px 90px #a1d3f0, 114px 90px #a1d3f0, 120px 90px #a1d3f0, 126px 90px #a1d3f0, 174px 108px #a1d3f0, 168px 102px #a1d3f0, 180px 102px #a1d3f0, 90px 120px #a1d3f0, 102px 114px #a1d3f0, 90px 114px #a1d3f0, 90px 102px #a1d3f0, 90px 96px #a1d3f0, 96px 108px #a1d3f0, 90px 108px #a1d3f0, 102px 96px #a1d3f0, 96px 96px #a1d3f0, 96px 102px #a1d3f0, 102px 102px #a1d3f0, 102px 108px #a1d3f0, 108px 108px #a1d3f0, 114px 114px #a1d3f0, 138px 114px #a1d3f0, 144px 114px #a1d3f0, 138px 108px #a1d3f0, 144px 108px #a1d3f0, 126px 102px #a1d3f0, 138px 102px #a1d3f0, 132px 102px #a1d3f0, 108px 114px #a1d3f0, 120px 114px #a1d3f0, 114px 108px #a1d3f0, 114px 102px #a1d3f0, 108px 90px #a1d3f0, 114px 96px #a1d3f0, 108px 96px #a1d3f0, 108px 102px #a1d3f0, 120px 102px #a1d3f0, 120px 96px #a1d3f0, 132px 96px #a1d3f0, 126px 96px #a1d3f0, 132px 114px #a1d3f0, 126px 114px #a1d3f0, 120px 108px #a1d3f0, 132px 108px #a1d3f0, 126px 108px #a1d3f0, 60px 84px #d29027, 54px 78px #d29027, 48px 72px #d29027, 84px 108px #000, 66px 108px #b1e7ff, 72px 102px #b1e7ff, 72px 96px #b1e7ff, 78px 96px #b1e7ff, 84px 90px #b1e7ff, 90px 90px #b1e7ff, 150px 114px #90c8eb, 156px 114px #90c8eb, 162px 114px #90c8eb, 168px 114px #90c8eb, 132px 90px #82c3eb, 138px 96px #82c3eb, 144px 102px #82c3eb, 150px 108px #82c3eb, 96px 120px #6eb5e5, 102px 120px #6eb5e5, 108px 120px #6eb5e5, 66px 102px #b6f0ff, 114px 120px #86c4eb, 126px 120px #86c4eb, 132px 120px #86c4eb, 138px 120px #86c4eb, 144px 120px #86c4eb, 150px 120px #86c4eb, 162px 120px #86c4eb, 156px 120px #86c4eb, 120px 120px #86c4eb, 96px 114px #a1d3f0, 84px 114px #a1d3f0, 78px 120px #a1d3f0, 72px 120px #a1d3f0, 66px 114px #a1d3f0, 78px 114px #e91e63, 72px 114px #e91e63, 66px 90px #d59327, 108px 162px #009ede, 108px 156px #009ede, 108px 150px #009ede, 102px 144px #009ede, 96px 138px #009ede, 90px 138px #009ede, 66px 144px #009ede, 84px 132px #009ede, 78px 132px #009ede, 114px 162px #009ede, 114px 156px #009ede, 114px 150px #009ede, 120px 138px #009ede, 126px 138px #009ede, 132px 138px #009ede, 138px 132px #009ede, 132px 132px #009ede, 150px 150px #009ede, 144px 132px #009ede, 102px 138px #009ede, 96px 132px #009ede, 120px 132px #009ede, 114px 138px #009ede, 102px 132px #3ac6f1, 108px 132px #3ac6f1, 114px 132px #3ac6f1, 108px 138px #3ac6f1, 156px 138px #6dcff3, 72px 138px #6dcff3, 114px 144px #009fdf, 108px 144px #009fdf, 120px 144px #3bc7f1, 78px 150px #3bc7f1;
}
.grumpy-cat {
    margin-left: 810px;
    width: 6px;
    height: 6px;
    background: transparent;
    box-shadow: 90px 114px #ec89ba, 96px 102px #8c7a73, 108px 90px #8c7a73, 114px 90px #8c7a73, 120px 90px #8c7a73, 126px 114px #8c7a73, 54px 114px #8c7a73, 66px 90px #8c7a73, 72px 90px #8c7a73, 108px 102px #191c13, 72px 102px #191c13, 42px 78px #8c7a73, 48px 72px #8c7a73, 48px 78px #8c7a73, 138px 78px #8c7a73, 132px 78px #8c7a73, 48px 84px #8c7a73, 42px 84px #8c7a73, 48px 102px #8c7a73, 48px 96px #8c7a73, 132px 108px #8c7a73, 132px 102px #8c7a73, 132px 96px #8c7a73, 48px 90px #f6e9f0, 42px 90px #f6e9f0, 42px 96px #f6e9f0, 30px 108px #f6e9f0, 42px 114px #f6e9f0, 42px 120px #f6e9f0, 48px 120px #f6e9f0, 54px 126px #f6e9f0, 48px 126px #f6e9f0, 42px 126px #f6e9f0, 48px 132px #f6e9f0, 54px 132px #f6e9f0, 60px 132px #f6e9f0, 66px 132px #f6e9f0, 60px 138px #f6e9f0, 90px 126px #f6e9f0, 84px 114px #f6e9f0, 78px 120px #f6e9f0, 72px 126px #f6e9f0, 66px 144px #f6e9f0, 84px 144px #f6e9f0, 78px 144px #f6e9f0, 72px 144px #f6e9f0, 90px 144px #f6e9f0, 90px 138px #f6e9f0, 84px 138px #f6e9f0, 90px 132px #f6e9f0, 96px 138px #f6e9f0, 96px 144px #f6e9f0, 108px 144px #f6e9f0, 114px 144px #f6e9f0, 102px 144px #f6e9f0, 114px 132px #f6e9f0, 96px 114px #f6e9f0, 102px 120px #f6e9f0, 108px 126px #f6e9f0, 126px 126px #f6e9f0, 132px 120px #f6e9f0, 132px 126px #f6e9f0, 120px 132px #f6e9f0, 126px 132px #f6e9f0, 120px 138px #f6e9f0, 138px 108px #f6e9f0, 138px 114px #f6e9f0, 144px 114px #f6e9f0, 90px 102px #f6e9f0, 90px 96px #f6e9f0, 96px 96px #f6e9f0, 84px 96px #f6e9f0, 84px 90px #f6e9f0, 96px 90px #f6e9f0, 90px 90px #f6e9f0, 78px 90px #f6e9f0, 102px 90px #f6e9f0, 66px 78px #f6e9f0, 78px 84px #f6e9f0, 72px 84px #f6e9f0, 84px 84px #f6e9f0, 90px 84px #f6e9f0, 96px 84px #f6e9f0, 102px 84px #f6e9f0, 108px 84px #f6e9f0, 120px 78px #f6e9f0, 114px 78px #f6e9f0, 114px 72px #f6e9f0, 108px 72px #f6e9f0, 102px 72px #f6e9f0, 84px 72px #f6e9f0, 78px 72px #f6e9f0, 96px 72px #f6e9f0, 90px 72px #f6e9f0, 72px 78px #f6e9f0, 72px 72px #f6e9f0, 78px 78px #f6e9f0, 84px 78px #f6e9f0, 90px 78px #f6e9f0, 96px 78px #f6e9f0, 102px 78px #f6e9f0, 108px 78px #f6e9f0, 132px 90px #f6e9f0, 138px 90px #f6e9f0, 138px 84px #8c7a73, 54px 138px #f6e9f0, 36px 126px #f6e9f0, 42px 132px #f6e9f0, 48px 138px #f6e9f0, 60px 144px #f6e9f0, 54px 144px #f6e9f0, 42px 138px #f6e9f0, 138px 120px #f6e9f0, 138px 126px #f6e9f0, 132px 132px #f6e9f0, 126px 138px #f6e9f0, 120px 144px #f6e9f0, 138px 132px #f6e9f0, 144px 126px #f6e9f0, 132px 138px #f6e9f0, 126px 144px #f6e9f0, 120px 102px #191c13, 126px 102px #191c13, 60px 102px #191c13, 54px 102px #191c13, 66px 108px #191c13, 114px 108px #191c13, 114px 102px #191c13, 66px 102px #191c13, 84px 108px #8c7a73, 96px 108px #8c7a73, 48px 114px #8c7a73, 48px 108px #8c7a73, 54px 120px #8c7a73, 132px 114px #8c7a73, 114px 84px #8c7a73, 120px 84px #8c7a73, 66px 84px #8c7a73, 60px 90px #8c7a73, 60px 84px #8c7a73, 60px 126px #8c7a73, 66px 126px #8c7a73, 114px 126px #8c7a73, 120px 126px #8c7a73, 126px 120px #8c7a73, 60px 108px #96d6e4, 66px 114px #96d6e4, 72px 114px #96d6e4, 108px 114px #96d6e4, 114px 114px #96d6e4, 120px 114px #96d6e4, 120px 108px #96d6e4, 72px 108px #fffffb, 108px 108px #fffffb, 66px 138px #f6e9f0, 54px 150px #751714, 60px 156px #751714, 66px 156px #751714, 72px 156px #751714, 78px 156px #751714, 84px 156px #751714, 90px 156px #751714, 96px 156px #751714, 102px 156px #751714, 108px 156px #751714, 114px 156px #751714, 120px 156px #751714, 126px 150px #751714, 90px 162px #fafd8f, 84px 168px #fafd8f, 96px 168px #fafd8f, 90px 174px #fafd8f, 96px 162px #751714, 102px 162px #751714, 84px 162px #751714, 78px 162px #751714, 90px 168px #f88028, 72px 12px #000, 72px 18px #000, 72px 24px #000, 72px 30px #000, 72px 36px #000, 90px 36px #000, 84px 30px #000, 78px 24px #000, 90px 30px #000, 90px 24px #000, 90px 18px #000, 90px 12px #000, 102px 12px #000, 102px 18px #000, 102px 24px #000, 102px 30px #000, 102px 36px #000, 108px 12px #000, 114px 12px #000, 114px 18px #000, 114px 24px #000, 114px 30px #000, 114px 36px #000, 108px 36px #000, 78px 18px #000, 72px 120px #000, 66px 120px #000, 60px 120px #000, 60px 114px #96d6e4, 108px 120px #000, 114px 120px #000, 120px 120px #000, 114px 138px #f6e9f0, 96px 132px #f6e9f0, 84px 132px #f6e9f0, 126px 108px #191c13, 54px 108px #191c13, 108px 138px #f6e9f0, 72px 138px #f6e9f0, 108px 132px #f6e9f0, 72px 132px #f6e9f0, 90px 120px #583e31, 126px 90px #8c7a73, 54px 90px #8c7a73, 102px 138px #f6e9f0, 78px 138px #f6e9f0, 96px 126px #f6e9f0, 84px 126px #f6e9f0, 84px 120px #583e31, 96px 120px #583e31, 78px 126px #583e31, 78px 132px #583e31, 102px 126px #583e31, 102px 132px #583e31, 78px 114px #000, 78px 108px #000, 102px 114px #000, 102px 108px #000, 102px 102px #000, 84px 102px #8c7a73, 78px 102px #000, 54px 96px #8c7a73, 60px 96px #8c7a73, 72px 96px #8c7a73, 66px 96px #8c7a73, 114px 96px #8c7a73, 126px 96px #8c7a73, 120px 96px #8c7a73, 78px 96px #000, 108px 96px #8c7a73, 102px 96px #000, 90px 108px #f6e9f0, 132px 144px #999195, 138px 138px #999195, 144px 132px #999195, 150px 126px #999195, 144px 120px #999195, 150px 114px #999195, 144px 102px #999195, 138px 102px #999195, 138px 96px #999195, 120px 150px #999195, 114px 150px #999195, 108px 150px #999195, 102px 150px #999195, 96px 150px #999195, 90px 150px #999195, 84px 150px #999195, 78px 150px #999195, 72px 150px #999195, 66px 150px #999195, 60px 150px #999195, 48px 144px #999195, 42px 144px #999195, 36px 138px #999195, 36px 132px #f6e9f0, 30px 132px #999195, 30px 126px #f6e9f0, 24px 126px #999195, 36px 120px #999195, 36px 114px #f6e9f0, 30px 120px #999195, 30px 114px #999195, 24px 108px #999195, 24px 102px #999195, 24px 96px #999195, 30px 102px #999195, 36px 108px #999195, 42px 108px #999195, 42px 102px #999195, 36px 96px #999195, 36px 90px #999195, 36px 84px #999195, 36px 78px #999195, 42px 72px #999195, 48px 66px #999195, 54px 66px #999195, 54px 72px #999195, 54px 78px #999195, 54px 84px #999195, 60px 78px #999195, 66px 72px #999195, 78px 66px #999195, 84px 66px #999195, 90px 66px #999195, 72px 66px #999195, 96px 66px #999195, 108px 66px #999195, 102px 66px #999195, 114px 66px #999195, 120px 72px #999195, 126px 78px #999195, 132px 84px #8c7a73, 126px 84px #999195, 36px 102px #999195, 132px 72px #999195, 138px 72px #999195, 144px 60px #999195, 144px 66px #999195, 144px 72px #999195, 144px 84px #999195, 144px 78px #999195, 144px 90px #999195, 144px 108px #999195, 54px 60px #999195, 54px 54px #999195, 144px 96px #999195, 150px 102px #999195;
}
.blink {
    animation: blink 1s steps(5, start) infinite;
    -webkit-animation: blink 1s steps(5, start) infinite;
}
@keyframes blink {
    to {
        visibility: hidden;
    }
}
@-webkit-keyframes blink {
    to {
        visibility: hidden;
    }
}
@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-moz-keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
.fade-in {
    opacity: 0;
    -webkit-animation: fadeIn ease-in 1;
    -moz-animation: fadeIn ease-in 1;
    animation: fadeIn ease-in 1;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    animation-duration: 1s;
}
.delay-2 {
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}
.delay-3 {
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
}
.delay-4 {
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
}

HTML

8-Bit CSS Artwork. Unicorns & Narwals.

编辑器支持Emmet

快捷键

8-Bit CSS Artwork. Unicorns & Narwals.

HTML5/CSS3 哆啦A梦 | 机器猫卡通肖像

CSS3 图文卡片模板

编辑器支持Emmet

快捷键

语言：

语言：

导入代码模板：