CSS Backdrop Filter

Method of applying filter effects (like blur, grayscale or hue) to content/elements below the target element.

Spec	https://drafts.fxtf.org/filter-effects-2/#BackdropFilterProperty
Status	Unofficial / Note

IE	Edge	Firefox	Chrome	Safari	Opera
			98
		95 ⁽³⁾	97
		94 ⁽³⁾	96	TP ^(*)
11	95	93 ⁽³⁾	95	15 ^(*)	80
10	94	92 ⁽³⁾	94	14.1 ^(*)	79
9	93	91 ⁽³⁾	93	14 ^(*)	78
8	92	90 ⁽³⁾	92	13.1 ^(*)	77
Show all
7	91	89 ⁽³⁾	91	13 ^(*)	76
6	90	88 ⁽³⁾	90	12.1 ^(*)	75
5.5	89	87 ⁽³⁾	89	12 ^(*)	74
	88	86 ⁽³⁾	88	11.1 ^(*)	73
	87	85 ⁽³⁾	87	11 ^(*)	72
	86	84 ⁽³⁾	86	10.1 ^(*)	71
	85	83 ⁽³⁾	85	10 ^(*)	70
	84	82 ⁽³⁾	84	9.1 ^(*)	69
	83	81 ⁽³⁾	83	9 ^(*)	68
	81	80 ⁽³⁾	81	8	67
	80	79 ⁽³⁾	80	7.1	66
	79	78 ⁽³⁾	79	7	65
	18 ⁽²⁾	77 ⁽³⁾	78	6.1	64
	17 ⁽²⁾	76 ⁽³⁾	77	6	63 ⁽¹⁾
	16	75 ⁽³⁾	76	5.1	62 ⁽¹⁾
	15	74 ⁽³⁾	75 ⁽¹⁾	5	60 ⁽¹⁾
	14	73 ⁽³⁾	74 ⁽¹⁾	4	58 ⁽¹⁾
	13	72 ⁽³⁾	73 ⁽¹⁾	3.2	57 ⁽¹⁾
	12	71 ⁽³⁾	72 ⁽¹⁾	3.1	56 ⁽¹⁾
		70 ⁽³⁾	71 ⁽¹⁾		55 ⁽¹⁾
		69	70 ⁽¹⁾		54 ⁽¹⁾
		68	69 ⁽¹⁾		53 ⁽¹⁾
		67	68 ⁽¹⁾		52 ⁽¹⁾
		66	67 ⁽¹⁾		51 ⁽¹⁾
		65	66 ⁽¹⁾		50 ⁽¹⁾
		64	65 ⁽¹⁾		49 ⁽¹⁾
		63	64 ⁽¹⁾		48 ⁽¹⁾
		62	63 ⁽¹⁾		47 ⁽¹⁾
		61	62 ⁽¹⁾		46 ⁽¹⁾
		60	61 ⁽¹⁾		45 ⁽¹⁾
		59	60 ⁽¹⁾		44 ⁽¹⁾
		58	59 ⁽¹⁾		43 ⁽¹⁾
		57	58 ⁽¹⁾		42 ⁽¹⁾
		56	57 ⁽¹⁾		41 ⁽¹⁾
		55	56 ⁽¹⁾		40 ⁽¹⁾
		54	55 ⁽¹⁾		39 ⁽¹⁾
		53	54 ⁽¹⁾		38 ⁽¹⁾
		52	53 ⁽¹⁾		37 ⁽¹⁾
		51	52 ⁽¹⁾		36 ⁽¹⁾
		50	51 ⁽¹⁾		35 ⁽¹⁾
		49	50 ⁽¹⁾		34 ⁽¹⁾
		48	49 ⁽¹⁾		33
		47	48 ⁽¹⁾		32
		46	47 ⁽¹⁾		31
		45	46		30
		44	45		29
		43	44		28
		42	43		27
		41	42		26
		40	41		25
		39	40		24
		38	39		23
		37	38		22
		36	37		21
		35	36		20
		34	35		19
		33	34		18
		32	33		17
		31	32		16
		30	31		15
		29	30		12.1
		28	29		12
		27	28		11.6
		26	27		11.5
		25	26		11.1
		24	25		11
		23	24		10.6
		22	23		10.5
		21	22		10.0-10.1
		20	21		9.5-9.6
		19	20		9
		18	19
		17	18
		16	17
		15	16
		14	15
		13	14
		12	13
		11	12
		10	11
		9	10
		8	9
		7	8
		6	7
		5	6
		4	5
		3.6	4
		3.5
		3
		2

Safari on iOS	Opera Mini	Android Browser	Blackberry Browser	Opera Mobile	Android Chrome	Android Firefox	IE Mobile	Android UC Browser	Samsung Internet	QQ Browser	Baidu Browser	KaiOS Browser
15 ^(*)	all	94	10	64	94	92 ⁽³⁾	11	12.12	15.0	10.4 ⁽¹⁾	7.12 ⁽¹⁾	2.5
14.5-14.8 ^(*)		4.4.3-4.4.4	7	12.1			10		14.0
14.0-14.4 ^(*)		4.4		12					13.0
13.4-13.7 ^(*)		4.2-4.3		11.5					12.0
Show all
13.3 ^(*)		4.1		11.1					11.1-11.2 ⁽¹⁾
13.2 ^(*)		4		11					10.1 ⁽¹⁾
13.0-13.1 ^(*)		3		10					9.2 ⁽¹⁾
12.2-12.5 ^(*)		2.3							8.2 ⁽¹⁾
12.0-12.1 ^(*)		2.2							7.2-7.4 ⁽¹⁾
11.3-11.4 ^(*)		2.1							6.2-6.4 ⁽¹⁾
11.0-11.2 ^(*)									5.0-5.4 ⁽¹⁾
10.3 ^(*)									4
10.0-10.2 ^(*)
9.3 ^(*)
9.0-9.2 ^(*)
8.1-8.4
8
7.0-7.1
6.0-6.1
5.0-5.1
4.2-4.3
4.0-4.1
3.2

Notes

Can be enabled via the "Experimental Web Platform Features" flag
Currently only supported with the -webkit- prefix (not -ms-)
Can be enabled by setting the layout.css.backdrop-filter.enabled and gfx.webrender.all preference to true in about:config.

^* Partial support with prefix.

Bugs

Chrome feature request: Chromium issue #497522
Firefox feature request: Mozilla bug #1178765

Resources

Data by caniuse.com
Licensed under the Creative Commons Attribution License v4.0.
https://caniuse.com/css-backdrop-filter