CSS Canvas Drawings

Method of using HTML5 Canvas as a background image. Not currently part of any specification.

Spec	https://webkit.org/blog/176/css-canvas-drawing/
Status	Unofficial / Note

IE	Edge	Firefox	Chrome	Safari	Opera
			108
		107	107	TP (*)
		106	106	16.1 (*)
11	105	105	105	16.0 (*)	91
10	104	104	104	15.6 (*)	90
9	103	103	103	15.5 (*)	89
8	102	102	102	15.4 (*)	88
Show all
7	101	101	101	15.2-15.3 (*)	87
6	100	100	100	15.1 (*)	86
5.5	99	99	99	15 (*)	85
	98	98	98	14.1 (*)	84
	97	97	97	14 (*)	83
	96	96	96	13.1 (*)	82
	95	95	95	13 (*)	81
	94	94	94	12.1 (*)	80
	93	93	93	12 (*)	79
	92	92	92	11.1 (*)	78
	91	91	91	11 (*)	77
	90	90	90	10.1 (*)	76
	89	89	89	10 (*)	75
	88	88	88	9.1 (*)	74
	87	87	87	9 (*)	73
	86	86	86	8 (*)	72
	85	85	85	7.1 (*)	71
	84	84	84	7 (*)	70
	83	83	83	6.1 (*)	69
	81	82	81	6 (*)	68
	80	81	80	5.1 (*)	67
	79	80	79	5 (*)	66
	18	79	78	4 (*)	65
	17	78	77	3.2	64
	16	77	76	3.1	63
	15	76	75		62
	14	75	74		60
	13	74	73		58
	12	73	72		57
		72	71		56
		71	70		55
		70	69		54
		69	68		53
		68	67		52
		67	66		51
		66	65		50
		65	64		49
		64	63		48
		63	62		47
		62	61		46
		61	60		45
		60	59		44
		59	58		43
		58	57		42
		57	56		41
		56	55		40
		55	54		39
		54	53		38
		53	52		37
		52	51		36
		51	50		35
		50	49		34 (*)
		49	48		33 (*)
		48	47 (*)		32 (*)
		47	46 (*)		31 (*)
		46	45 (*)		30 (*)
		45	44 (*)		29 (*)
		44	43 (*)		28 (*)
		43	42 (*)		27 (*)
		42	41 (*)		26 (*)
		41	40 (*)		25 (*)
		40	39 (*)		24 (*)
		39	38 (*)		23 (*)
		38	37 (*)		22 (*)
		37	36 (*)		21 (*)
		36	35 (*)		20 (*)
		35	34 (*)		19 (*)
		34	33 (*)		18 (*)
		33	32 (*)		17 (*)
		32	31 (*)		16 (*)
		31	30 (*)		15 (*)
		30	29 (*)		12.1
		29	28 (*)		12
		28	27 (*)		11.6
		27	26 (*)		11.5
		26	25 (*)		11.1
		25	24 (*)		11
		24	23 (*)		10.6
		23	22 (*)		10.5
		22	21 (*)		10.0-10.1
		21	20 (*)		9.5-9.6
		20	19 (*)		9
		19	18 (*)
		18	17 (*)
		17	16 (*)
		16	15 (*)
		15	14 (*)
		14	13 (*)
		13	12 (*)
		12	11 (*)
		11	10 (*)
		10	9 (*)
		9	8 (*)
		8	7 (*)
		7	6 (*)
		6	5 (*)
		5	4 (*)
		4
		3.6
		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
16.1 (*)
16.0 (*)	all	105	10 (*)	64	105	104	11	13.4	18.0	13.1	13.18	2.5
15.6 (*)		4.4.3-4.4.4 (*)	7 (*)	12.1			10		17.0
15.5 (*)		4.4 (*)		12					16.0
15.4 (*)		4.2-4.3 (*)		11.5					15.0
Show all
15.2-15.3 (*)		4.1 (*)		11.1					14.0
15.0-15.1 (*)		4 (*)		11					13.0
14.5-14.8 (*)		3 (*)		10					12.0
14.0-14.4 (*)		2.3 (*)							11.1-11.2
13.4-13.7 (*)		2.2 (*)							10.1
13.3 (*)		2.1 (*)							9.2
13.2 (*)									8.2
13.0-13.1 (*)									7.2-7.4
12.2-12.5 (*)									6.2-6.4
12.0-12.1 (*)									5.0-5.4
11.3-11.4 (*)									4 (*)
11.0-11.2 (*)
10.3 (*)
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

A similar effect can be achieved in Firefox 4+ using the -moz-element() background property

^* Partial support with prefix.

Resources

• WebKit blog post