PURE CSS ART GALLERY

Loading artwork...

Rachel Bull

CSS Brian Griffin from Family Guy recreated in pure CSS. This was created with only HTML elements, CSS3 pseudo classes and box-shadows.

Edit on Codepen

Async `<link>`

Total

…s

Download

Start: …ms

Duration: …ms

Render

Start: …ms

Duration: 1…ms

localStorage

Total

…s

Download

Start: …ms

Duration: …ms

Render

Start: …ms

Duration: 1…ms

Cache-API

Total

…s

Download

Start: …ms

Duration: …ms

Render

Start: …ms

Duration: 1…ms

Browser	OS	Async	localStorage	Cache-API	Tests	Improvement
Chrome 96.0	OS X 10.15.7 64-bit	224.90ms	1.50ms	5.25ms	2	-
Chrome 96.0	null	20.00ms	0.00ms	340.05ms	2	-
Chrome 99.0	OS X 10.15.7 64-bit	311.45ms	1.15ms	5.75ms	2	-
Chrome 97.0	null	54.95ms	0.00ms	289.95ms	2	-
Safari 15.3	OS X 10.15.7	203.00ms	5.50ms	7.50ms	2	-
Chrome 87.0	Linux 64-bit	492.89ms	1.05ms	1.98ms	1	-
Firefox 96.0	Windows 10 64-bit	209.00ms	1.00ms	6.00ms	1	-
Chrome 98.0	OS X 10.15.7 64-bit	530.90ms	1.00ms	8.60ms	1	-
Firefox 95.0	OS X 10.15	163.00ms	1.00ms	32.00ms	1	-
Chrome 100.0	Windows 10 64-bit	530.90ms	2.30ms	15.40ms	1	-
Chrome Mobile 96.0	Android 11	256.70ms	3.40ms	12.00ms	1	-
Safari 15.4	OS X 10.15.7	173.00ms	1.00ms	15.00ms	1	-
Firefox 96.0	Ubuntu 64-bit	225.00ms	6.00ms	25.00ms	1	-
Firefox 97.0	Windows 10 64-bit	199.00ms	5.00ms	18.00ms	1	-
Safari 15.3	iOS 15.3	521.00ms	2.00ms	10.00ms	1	-
Firefox 97.0	OS X 10.15	294.00ms	2.00ms	8.00ms	1	-
Chrome Mobile 98.0	Android 10	666.40ms	6.30ms	103.90ms	1	-
Firefox for iOS 97.0	iOS 15.3.1	223.00ms	1.00ms	6.00ms	1	-
Firefox 99.0	OS X 10.15	148.00ms	2.00ms	12.00ms	1	-
Chrome 100.0	OS X 10.15.7 64-bit	73.40ms	1.10ms	11.40ms	1	-