通过 CSS Shadow，可以创建一些非常令人印象深刻的阴影，可以与 Photoshop 等工具中的阴影相媲美。 这里收集整理了CodePen 上 有创意的CSS Shadow 的 代码片段，小伙伴们用起来吧~
漂亮的 CSS 盒子阴影
CSS box-shadow 属性非常灵活——下面的代码片段中有90多个不同效果的例子，你一定会找到一个适合你的需要。
错误404页面设计
这个404错误提供了一个独特的阴影。它结合了 CSS 转换和绝对定位元素，为每个容器创建一个倾斜的外观，其结果是一个冷静的美学与一个突出的视觉流。
`
笔触，阴影 + 半色调效果
创造性地使用阴影可以给工作带来一些有趣的地方。在这里，可以用来精心制作偏移外观，包括半色调 SVG 模式。它们创造了一种轻松愉快的氛围，非常适用于页面和区域标题等。
使用 CSS 的 Netflix 风格的文本动画
在这里看到的“ Netflix”效果包括一个标志性的长阴影，消失在最终的结果。这是一个相对基本的 CSS 关键帧动画，但是却产生了大胆的影响——就像你最喜欢的节目的开头一样。更妙的是，可以在浏览器中自定义文本。
霓虹灯的文字-阴影效果
我们通常将阴影用于创建对比，这里text-shadow 属性为这些字符提供了霓虹灯外观。添加一点动画，你就有了一个吸引眼球的标题或标志了。
动画 CSS 邮件按钮
阴影也可以用来增强灯光效果，就像我们看到的这个信封。将鼠标悬停在该对象上，注意当信封靠近该对象时透视阴影是如何收缩的。虽然它不是主要的吸引力，但它确实增加了一点现实主义色彩。
阴影的形状
给一个非矩形的形状添加一个阴影可能看起来没什么大不了的，但是在网络上这并不总是这样。在这里，通过使用 CSS 过滤器属性，可以创建一个完美地沿着自定义形状路径的阴影。
分层文字-阴影效果
在文本阴影背后隐藏的技巧是能够层阴影-所有在同一属性。总的来说，有多达九层用于创建这个多彩的3D 文本, 这个片段有一个很酷的复古氛围，同时还有很多其他的可能性。