Mirror of static site repo git.pfy.ch/pfych/static
Something went wrong. Try again.
933 B · 49 lines
HTML
at master
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849<html><head> <title>Tiling</title></head><body></body><style> @property --offset { syntax: '<length>'; inherits: false; initial-value: 0px; }
@keyframes shift { 0% { --offset: 0px; }
100% { --offset: 100px; } }
body, html { height: 100vh; width: 100vw; padding: unset; margin: unset; }
body { --offset: 0px; --size: 20px;
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40'>\ <rect fill='%2391eae4' x='0' y='0' width='20px' height='20px'/>\ <rect fill='%2386a8e7' x='0' y='20' width='20px' height='20px'/>\ <rect fill='%2391eae4' x='20' y='20' width='20px' height='20px'/>\ <rect fill='%2386a8e7' x='20' y='0' width='20px' height='20px'/>\ </svg>"); animation: shift 5s infinite linear;
background-position-x: var(--offset); background-position-y: var(--offset); }</style>