如何重新创建这个 iOS7 模糊效果

平面设计 效果 模糊
2022-01-24 08:42:43

尝试了很多,但我就是不明白,如何实现这样的半透明标签栏:

在此处输入图像描述

2个回答

底部是高斯模糊的,有一个半透明的白色覆盖。

Step1:选择背景上的覆盖区域(原始图像)并应用半径为12px的高斯模糊。

Step2:新建一个图层,选择叠加层相同的部分,填充白色,给这个图层的不透明度为66%

用您的参考图像的上半部分转载:
编辑: 与原始参数匹配的新参数

在此处输入图像描述

你没有定义你正在使用什么程序或技术。因此,虽然Peter 描述了一种使用 Photoshop 的好方法,但我想补充一点,这种效果也可以使用 CSS3 创建。

这是所需的 CSS 的一个高峰:

#iOSblur
{
    -webkit-filter: blur(12px);
    -moz-filter: blur(12px);
    -o-filter: blur(12x);
    -ms-filter: blur(12px);
    filter: blur(12px);
}

#iOSopacity
{
    opacity: 0.6;
}

并不是说你应该这样做……事实上,我个人会使用彼得的程序。