Eğer filter özelliğini kullanırsan div içerisindeki yazılara ve diğer etiketlerede etki eder kullandığınız blur. Bu yüzden siz backdrop-filter özelliğini kullanarak bu işlemi yapacaksınız.

Çalışan bir örnek;

<div class="box">
	<div>ÖRNEK YAZI</div>
</div>
<style>
    .box {
    	width: 200px;
    	height: 200px;
    	background: url(https://picsum.photos/200/200) no-repeat center;
    }
    .box div {
    	width: inherit;
    	height: inherit;
    	display: grid;
    	place-items: center;
    	-webkit-backdrop-filter: blur(5px);
      backdrop-filter: blur(5px);
    }
</style>

Ya da bir başka örneği, ::before ya da ::after ile content ekleyerek filter kullanılarak yapılabilir. Buna örnek vermek gerekirse;

<div class="box">
	ÖRNEK YAZI
</div>
<style>
    .box {
	width: 200px;
	height: 200px;
	position: relative;
	z-index: 1;
}
.box::before {
	content: '';
	background: url(https://picsum.photos/200/200) no-repeat center;
	position: absolute;
	top: 0;
	left: 0;
	width: inherit;
	height: inherit;
	z-index: -1;
	filter: blur(5px);
}
</style>