0


94款超级漂亮的box-shadow样式 复制即用

样式如图,代码已在结尾,按照序号复制粘贴便可直接用了:
在这里插入图片描述

代码:

box-shadow #0 css code ====> box-shadow:rgba(149,157,165,0.2) 0px 8px 24px;
box-shadow #1 css code ====> box-shadow:rgba(100,100,111,0.2) 0px 7px 29px 0px;
box-shadow #2 css code ====> box-shadow:rgba(0,0,0,0.15)1.95px 1.95px 2.6px;
box-shadow #3 css code ====> box-shadow:rgba(0,0,0,0.35) 0px 5px 15px;
box-shadow #4 css code ====> box-shadow:rgba(0,0,0,0.16) 0px 1px 4px;
box-shadow #5 css code ====> box-shadow:rgba(0,0,0,0.24) 0px 3px 8px;
box-shadow #6 css code ====> box-shadow:rgba(99,99,99,0.2) 0px 2px 8px 0px;
box-shadow #7 css code ====> box-shadow:rgba(0,0,0,0.16) 0px 1px 4px,rgb(51,51,51) 0px 0px 0px 3px;
box-shadow #8 css code ====> box-shadow:rgba(0,0,0,0.02) 0px 1px 3px 0px,rgba(27,31,35,0.15) 0px 0px 0px 1px;
box-shadow #9 css code ====> box-shadow:rgba(0,0,0,0.1) 0px 4px 12px;
box-shadow #10 css code ====> box-shadow:rgba(0,0,0,0.25) 0px 54px 55px,rgba(0,0,0,0.12) 0px -12px 30px,rgba(0,0,0,0.12) 0px 4px 6px,rgba(0,0,0,0.17) 0px 12px 13px,rgba(0,0,0,0.09) 0px -3px 5px;
box-shadow #11 css code ====> box-shadow:rgba(0,0,0,0.05) 0px 6px 24px 0px,rgba(0,0,0,0.08) 0px 0px 0px 1px;
box-shadow #12 css code ====> box-shadow:rgba(0,0,0,0.16) 0px 10px 36px 0px,rgba(0,0,0,0.06) 0px 0px 0px 1px;
box-shadow #13 css code ====> box-shadow:rgba(17,12,46,0.15) 0px 48px 100px 0px;
box-shadow #14 css code ====> box-shadow:rgba(50,50,93,0.25) 0px 50px 100px -20px,rgba(0,0,0,0.3) 0px 30px 60px -30px,rgba(10,37,64,0.35) 0px -2px 6px 0px inset;
box-shadow #15 css code ====> box-shadow:rgba(255,255,255,0.1) 0px 1px 1px 0px inset,rgba(50,50,93,0.25) 0px 50px 100px -20px,rgba(0,0,0,0.3) 0px 30px 60px -30px;
box-shadow #16 css code ====> box-shadow:rgba(50,50,93,0.25) 0px 50px 100px -20px,rgba(0,0,0,0.3) 0px 30px 60px -30px;
box-shadow #17 css code ====> box-shadow:rgba(50,50,93,0.25) 0px 50px 100px -20px,rgba(0,0,0,0.3) 0px 30px 60px -30px;
box-shadow #18 css code ====> box-shadow:rgba(50,50,93,0.25) 0px 13px 27px -5px,rgba(0,0,0,0.3) 0px 8px 16px -8px;
box-shadow #19 css code ====> box-shadow:rgba(50,50,93,0.25) 0px 2px 5px -1px,rgba(0,0,0,0.3) 0px 1px 3px -1px;
box-shadow #20 css code ====> box-shadow:rgb(38,57,77) 0px 20px 30px -10px;
box-shadow #21 css code ====> box-shadow:rgba(6,24,44,0.4) 0px 0px 0px 2px,rgba(6,24,44,0.65) 0px 4px 6px -1px,rgba(255,255,255,0.08) 0px 1px 0px inset;
box-shadow #22 css code ====> box-shadow:rgba(50,50,93,0.25) 0px 6px 12px -2px,rgba(0,0,0,0.3) 0px 3px 7px -3px;
box-shadow #23 css code ====> box-shadow:rgba(50,50,93,0.25) 0px 13px 27px -5px,rgba(0,0,0,0.3) 0px 8px 16px -8px;
box-shadow #24 css code ====> box-shadow:rgba(50,50,93,0.25) 0px 30px 60px -12px,rgba(0,0,0,0.3) 0px 18px 36px -18px;
box-shadow #25 css code ====> box-shadow:rgba(50,50,93,0.25) 0px 30px 60px -12px inset,rgba(0,0,0,0.3) 0px 18px 36px -18px inset;
box-shadow #26 css code ====> box-shadow:rgba(50,50,93,0.25) 0px 50px 100px -20px,rgba(0,0,0,0.3) 0px 30px 60px -30px;
box-shadow #27 css code ====> box-shadow:rgba(0,0,0,0.12) 0px 1px 3px,rgba(0,0,0,0.24) 0px 1px 2px;
box-shadow #28 css code ====> box-shadow:rgba(0,0,0,0.16) 0px 3px 6px,rgba(0,0,0,0.23) 0px 3px 6px;
box-shadow #29 css code ====> box-shadow:rgba(0,0,0,0.19) 0px 10px 20px,rgba(0,0,0,0.23) 0px 6px 6px;
box-shadow #30 css code ====> box-shadow:rgba(0,0,0,0.25) 0px 14px 28px,rgba(0,0,0,0.22) 0px 10px 10px;
box-shadow #31 css code ====> box-shadow:rgba(0,0,0,0.3) 0px 19px 38px,rgba(0,0,0,0.22) 0px 15px 12px;
box-shadow #32 css code ====> box-shadow:rgba(60,64,67,0.3) 0px 1px 2px 0px,rgba(60,64,67,0.15) 0px 2px 6px 2px;
box-shadow #33 css code ====> box-shadow:rgba(60,64,67,0.3) 0px 1px 2px 0px,rgba(60,64,67,0.15) 0px 1px 3px 1px;
box-shadow #34 css code ====> box-shadow:rgba(0,0,0,0.05) 0px 0px 0px 1px;
box-shadow #35 css code ====> box-shadow:rgba(0,0,0,0.05) 0px 1px 2px 0px;
box-shadow #36 css code ====> box-shadow:rgba(0,0,0,0.1) 0px 1px 3px 0px,rgba(0,0,0,0.06) 0px 1px 2px 0px;
box-shadow #37 css code ====> box-shadow:rgba(0,0,0,0.1) 0px 4px 6px -1px,rgba(0,0,0,0.06) 0px 2px 4px -1px;
box-shadow #38 css code ====> box-shadow:rgba(0,0,0,0.1) 0px 10px 15px -3px,rgba(0,0,0,0.05) 0px 4px 6px -2px;
box-shadow #39 css code ====> box-shadow:rgba(0,0,0,0.1) 0px 20px 25px -5px,rgba(0,0,0,0.04) 0px 10px 10px -5px;
box-shadow #40 css code ====> box-shadow:rgba(0,0,0,0.25) 0px 25px 50px -12px;
box-shadow #41 css code ====> box-shadow:rgba(0,0,0,0.06) 0px 2px 4px 0px inset;
box-shadow #42 css code ====> box-shadow:rgba(0,0,0,0.1) 0px 0px 5px 0px,rgba(0,0,0,0.1) 0px 0px 1px 0px;
box-shadow #43 css code ====> box-shadow:rgba(0,0,0,0.07) 0px 1px 2px,rgba(0,0,0,0.07) 0px 2px 4px,rgba(0,0,0,0.07) 0px 4px 8px,rgba(0,0,0,0.07) 0px 8px 16px,rgba(0,0,0,0.07) 0px 16px 32px,rgba(0,0,0,0.07) 0px 32px 64px;
box-shadow #44 css code ====> box-shadow:rgba(0,0,0,0.09) 0px 2px 1px,rgba(0,0,0,0.09) 0px 4px 2px,rgba(0,0,0,0.09) 0px 8px 4px,rgba(0,0,0,0.09) 0px 16px 8px,rgba(0,0,0,0.09) 0px 32px 16px;
box-shadow #45 css code ====> box-shadow:rgba(0,0,0,0.2) 0px 18px 50px -10px;
box-shadow #46 css code ====> box-shadow:rgba(0,0,0,0.1) 0px 10px 50px;
box-shadow #47 css code ====> box-shadow:rgba(0,0,0,0.04) 0px 3px 5px;
box-shadow #48 css code ====> box-shadow:rgba(240,46,170,0.4)-5px 5px,rgba(240,46,170,0.3)-10px 10px,rgba(240,46,170,0.2)-15px 15px,rgba(240,46,170,0.1)-20px 20px,rgba(240,46,170,0.05)-25px 25px;
box-shadow #49 css code ====> box-shadow:rgba(240,46,170,0.4) 0px 5px,rgba(240,46,170,0.3) 0px 10px,rgba(240,46,170,0.2) 0px 15px,rgba(240,46,170,0.1) 0px 20px,rgba(240,46,170,0.05) 0px 25px;
box-shadow #50 css code ====> box-shadow:rgba(240,46,170,0.4) 5px 5px,rgba(240,46,170,0.3) 10px 10px,rgba(240,46,170,0.2) 15px 15px,rgba(240,46,170,0.1) 20px 20px,rgba(240,46,170,0.05) 25px 25px;
box-shadow #51 css code ====> box-shadow:rgba(0,0,0,0.07) 0px 1px 1px,rgba(0,0,0,0.07) 0px 2px 2px,rgba(0,0,0,0.07) 0px 4px 4px,rgba(0,0,0,0.07) 0px 8px 8px,rgba(0,0,0,0.07) 0px 16px 16px;
box-shadow #52 css code ====> box-shadow:rgba(67,71,85,0.27) 0px 0px 0.25em,rgba(90,125,188,0.05) 0px 0.25em 1em;
box-shadow #53 css code ====> box-shadow:rgba(0,0,0,0.1) 0px 1px 2px 0px;
box-shadow #54 css code ====> box-shadow:rgba(27,31,35,0.04) 0px 1px 0px,rgba(255,255,255,0.25) 0px 1px 0px inset;
box-shadow #55 css code ====> box-shadow:rgba(3,102,214,0.3) 0px 0px 0px 3px;
box-shadow #56 css code ====> box-shadow:rgba(14,30,37,0.12) 0px 2px 4px 0px,rgba(14,30,37,0.32) 0px 2px 16px 0px;
box-shadow #57 css code ====> box-shadow:rgba(0,0,0,0.2) 0px 12px 28px 0px,rgba(0,0,0,0.1) 0px 2px 4px 0px,rgba(255,255,255,0.05) 0px 0px 0px 1px inset;
box-shadow #58 css code ====> box-shadow:rgba(0,0,0,0.15) 0px 5px 15px 0px;
box-shadow #59 css code ====> box-shadow:rgba(33,35,38,0.1) 0px 10px 10px -10px;
box-shadow #60 css code ====> box-shadow: blue 0px 0px 0px 2px inset,rgb(255,255,255) 10px -10px 0px -3px,rgb(31,193,27) 10px -10px,rgb(255,255,255) 20px -20px 0px -3px,rgb(255,217,19) 20px -20px,rgb(255,255,255) 30px -30px 0px -3px,rgb(255,156,85) 30px -30px,rgb(255,255,255) 40px -40px 0px -3px,rgb(255,85,85) 40px -40px; border-radius: 0px;
box-shadow #61 css code ====> box-shadow:rgb(85,91,255) 0px 0px 0px 3px,rgb(31,193,27) 0px 0px 0px 6px,rgb(255,217,19) 0px 0px 0px 9px,rgb(255,156,85) 0px 0px 0px 12px,rgb(255,85,85) 0px 0px 0px 15px; border-radius: 0px;
box-shadow #62 css code ====> box-shadow:rgb(204,219,232) 3px 3px 6px 0px inset,rgba(255,255,255,0.5)-3px -3px 6px 1px inset;
box-shadow #63 css code ====> box-shadow:rgba(136,165,191,0.48) 6px 2px 16px 0px,rgba(255,255,255,0.8)-6px -2px 16px 0px;
box-shadow #64 css code ====> box-shadow:rgba(17,17,26,0.1) 0px 1px 0px;
box-shadow #65 css code ====> box-shadow:rgba(17,17,26,0.05) 0px 1px 0px,rgba(17,17,26,0.1) 0px 0px 8px;
box-shadow #66 css code ====> box-shadow:rgba(17,17,26,0.1) 0px 0px 16px;
box-shadow #67 css code ====> box-shadow:rgba(17,17,26,0.05) 0px 4px 16px,rgba(17,17,26,0.05) 0px 8px 32px;
box-shadow #68 css code ====> box-shadow:rgba(17,17,26,0.1) 0px 4px 16px,rgba(17,17,26,0.05) 0px 8px 32px;
box-shadow #69 css code ====> box-shadow:rgba(17,17,26,0.1) 0px 1px 0px,rgba(17,17,26,0.1) 0px 8px 24px,rgba(17,17,26,0.1) 0px 16px 48px;
box-shadow #70 css code ====> box-shadow:rgba(17,17,26,0.1) 0px 4px 16px,rgba(17,17,26,0.1) 0px 8px 24px,rgba(17,17,26,0.1) 0px 16px 56px;
box-shadow #71 css code ====> box-shadow:rgba(17,17,26,0.1) 0px 8px 24px,rgba(17,17,26,0.1) 0px 16px 56px,rgba(17,17,26,0.1) 0px 24px 80px;
box-shadow #72 css code ====> box-shadow:rgba(50,50,105,0.15) 0px 2px 5px 0px,rgba(0,0,0,0.05) 0px 1px 1px 0px;
box-shadow #73 css code ====> box-shadow:rgba(0,0,0,0.15) 0px 15px 25px,rgba(0,0,0,0.05) 0px 5px 10px;
box-shadow #74 css code ====> box-shadow:rgba(0,0,0,0.15)2.4px 2.4px 3.2px;
box-shadow #75 css code ====> box-shadow:rgba(0,0,0,0.15) 0px 3px 3px 0px;
box-shadow #76 css code ====> box-shadow:rgba(0,0,0,0.08) 0px 4px 12px;
box-shadow #77 css code ====> box-shadow:rgba(0,0,0,0.15) 0px 2px 8px;
box-shadow #78 css code ====> box-shadow:rgba(0,0,0,0.18) 0px 2px 4px;
box-shadow #79 css code ====> box-shadow:rgba(0,0,0,0.1)-4px 9px 25px -6px;
box-shadow #80 css code ====> box-shadow:rgba(0,0,0,0.2) 0px 60px 40px -7px;
box-shadow #81 css code ====> box-shadow:rgba(0,0,0,0.4) 0px 30px 90px;
box-shadow #82 css code ====> box-shadow:rgba(0,0,0,0.56) 0px 22px 70px 4px;
box-shadow #83 css code ====> box-shadow:rgba(0,0,0,0.2) 0px 20px 30px;
box-shadow #84 css code ====> box-shadow:rgba(255,255,255,0.2) 0px 0px 0px 1px inset,rgba(0,0,0,0.9) 0px 0px 0px 1px;
box-shadow #85 css code ====> box-shadow:rgba(0,0,0,0.25) 0px 0.0625em 0.0625em,rgba(0,0,0,0.25) 0px 0.125em 0.5em,rgba(255,255,255,0.1) 0px 0px 0px 1px inset;
box-shadow #86 css code ====> box-shadow:rgba(0,0,0,0.09) 0px 3px 12px;
box-shadow #87 css code ====> box-shadow:rgba(0,0,0,0.17) 0px -23px 25px 0px inset,rgba(0,0,0,0.15) 0px -36px 30px 0px inset,rgba(0,0,0,0.1) 0px -79px 40px 0px inset,rgba(0,0,0,0.06) 0px 2px 1px,rgba(0,0,0,0.09) 0px 4px 2px,rgba(0,0,0,0.09) 0px 8px 4px,rgba(0,0,0,0.09) 0px 16px 8px,rgba(0,0,0,0.09) 0px 32px 16px; border-radius: 35px;
box-shadow #88 css code ====> box-shadow:rgba(0,0,0,0.45) 0px 25px 20px -20px;
box-shadow #89 css code ====> box-shadow:rgba(0,0,0,0.4) 0px 2px 4px,rgba(0,0,0,0.3) 0px 7px 13px -3px,rgba(0,0,0,0.2) 0px -3px 0px inset;
box-shadow #90 css code ====> box-shadow:rgba(0,0,0,0.05) 0px 0px 0px 1px,rgb(209,213,219) 0px 0px 0px 1px inset;
box-shadow #91 css code ====> box-shadow:rgba(0,0,0,0.35) 0px -50px 36px -28px inset;
box-shadow #92 css code ====> box-shadow:rgba(9,30,66,0.25) 0px 1px 1px,rgba(9,30,66,0.13) 0px 0px 1px 1px;
box-shadow #93 css code ====> box-shadow:rgba(9,30,66,0.25) 0px 4px 8px -2px,rgba(9,30,66,0.08) 0px 0px 0px 1px;
标签: css 前端 html

本文转载自: https://blog.csdn.net/qq_43592352/article/details/128636003
版权归原作者 征途黯然. 所有, 如有侵权,请联系我们删除。

“94款超级漂亮的box-shadow样式 复制即用”的评论:

还没有评论