加入阴影效果，使得这套图标看起来更符合人们的视觉经验，并能更好地将图标层与背景层区分开来。
每个图标都是一个单独的文件。这个浏览器图标也不例外，文件整体是这样的：
这个图标文件由四个图层组成，分别是「基座」、内容层、「盖子」、参考线：
那么，就一层一层来说吧。
最下面的一层也是最复杂的一层，是这个图标的「基座」，由两个矢量对象组成：
灰白色的底层很简单，没有描边，只有一个填色层，方向是从上到下，模拟光源自顶向下照射。
灰框蓝色的基座就比较复杂了，这个矢量对象的外观面板嘛……是这个样子：
一共有两个描边层，六个填色层。
似乎的确有些复杂，那么稍做简化一下吧。在「外观」面板里，只保留两个描边和蓝色填色层的可见性。这样，可以清楚地看到这个矢量图形主体元素：
两个描边的作用，是用来表现银色边框。两个边框均为沿图形内侧对齐，上面的是 2px 宽度，下面的是 3px 宽度，用不同的灰度来表现边框的立体感。边框的材质假定是一种稍微粗糙一些的金属，有一个自顶向下照射的光源和环境光。在上一个教程里，介绍了金属材质的光学特性。金属材质在单一光源照射下，会有一个特别亮的高光区，并且高光区在边缘处亮度会很快地衰减。因此，在这里同理，为模拟这样的金属材质，描边的渐变应该做类似这样的设置：
在边框下面的是蓝色渐变的填色层，填色层一共有四个效果：
