intercal/colorhash
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add a new "rainbow-reverse" palette for randomart

Browse Source 
This tries to add a bit more color distinction to the randomart
algorithm. As it so happens, half of the randomart examples got
converted to using the new palette, so that's a nice little win.

Signed-off-by: Alek Ratzloff <alekratz@gmail.com>
This commit is contained in:
Alek Ratzloff
2024-05-30 12:27:27 -07:00
parent 43e99e15bb
commit 5b5c2444db
8 changed files with 473 additions and 472 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
colorhash/palettes.py
View File

@@ -150,6 +150,7 @@ GRADIENT_PALETTES = {
MULTICOLOR_PALETTES = {
"rainbow": StaticPalette(hsl_colors(range(0, 360), 100, 50)),
"rainbow-reverse": StaticPalette(list(reversed(hsl_colors(range(0, 360), 100, 50)))),
}
DEFAULT_PALETTES = {

112
examples/asdf-sha224-randomart.svg
View File

@@ -1,58 +1,58 @@
<svg width="256" height="224" xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="224" y="0" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="32" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="64" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="96" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="224" y="128" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="224" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="0" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="32" y="192" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="192" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="128" y="192" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="160" y="192" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="192" y="192" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="224" y="192" width="32" height="32" fill="hsl(216.00,100.00%,50.00%)" />
<rect x="0" y="0" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="224" y="0" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="32" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="64" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="96" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="224" y="128" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="224" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="0" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="32" y="192" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="192" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="128" y="192" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="160" y="192" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="192" y="192" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="224" y="192" width="32" height="32" fill="hsl(144.00,100.00%,50.00%)" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.5 KiB

After

Width:  |  Height:  |  Size: 4.6 KiB

220
examples/asdf-sha384-randomart.svg
View File

@@ -1,112 +1,112 @@
<svg width="352" height="320" xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="224" y="0" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="256" y="0" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="288" y="0" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="320" y="0" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="256" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="288" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="320" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="256" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="288" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="320" y="64" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(144.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="224" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="256" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="288" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="320" y="96" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(144.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="256" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="288" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="320" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="256" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="288" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="320" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="0" y="192" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="32" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="192" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="256" y="192" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="288" y="192" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="320" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="0" y="224" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="224" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="224" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="224" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="224" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="224" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="224" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="224" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="256" y="224" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="288" y="224" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="320" y="224" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="0" y="256" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="256" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="256" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="256" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="128" y="256" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="256" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="256" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="224" y="256" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="256" y="256" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="288" y="256" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="320" y="256" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="0" y="288" width="32" height="32" fill="hsl(216.00,100.00%,50.00%)" />
<rect x="32" y="288" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="288" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="288" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="128" y="288" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="288" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="288" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="224" y="288" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="256" y="288" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="288" y="288" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="320" y="288" width="32" height="32" fill="hsl(144.00,100.00%,50.00%)" />
<rect x="0" y="0" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="224" y="0" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="256" y="0" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="288" y="0" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="320" y="0" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="256" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="288" y="32" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="320" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="256" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="288" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="320" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(216.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="224" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="256" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="288" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="320" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(216.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="256" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="288" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="320" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="256" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="288" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="320" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="192" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="32" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="192" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="256" y="192" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="288" y="192" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="320" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="224" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="32" y="224" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="224" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="224" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="224" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="224" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="224" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="224" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="256" y="224" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="288" y="224" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="320" y="224" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="256" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="32" y="256" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="256" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="256" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="256" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="256" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="256" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="224" y="256" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="256" y="256" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="288" y="256" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="320" y="256" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="288" width="32" height="32" fill="hsl(144.00,100.00%,50.00%)" />
<rect x="32" y="288" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="288" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="288" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="288" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="288" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="288" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="224" y="288" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="256" y="288" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="288" y="288" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="320" y="288" width="32" height="32" fill="hsl(216.00,100.00%,50.00%)" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.9 KiB

After

Width:  |  Height:  |  Size: 9.0 KiB

220
examples/asdf-sha512-randomart.svg
View File

@@ -1,112 +1,112 @@
<svg width="352" height="320" xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="224" y="0" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="256" y="0" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="288" y="0" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="320" y="0" width="32" height="32" fill="hsl(216.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="32" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="256" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="288" y="32" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="320" y="32" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="224" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="256" y="64" width="32" height="32" fill="hsl(168.00,100.00%,50.00%)" />
<rect x="288" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="320" y="64" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="224" y="96" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="256" y="96" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="288" y="96" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="320" y="96" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="224" y="128" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="256" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="288" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="320" y="128" width="32" height="32" fill="hsl(192.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="224" y="160" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="256" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="288" y="160" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="320" y="160" width="32" height="32" fill="hsl(144.00,100.00%,50.00%)" />
<rect x="0" y="192" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="192" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="192" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="160" y="192" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="192" y="192" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="224" y="192" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="256" y="192" width="32" height="32" fill="hsl(168.00,100.00%,50.00%)" />
<rect x="288" y="192" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="320" y="192" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="0" y="224" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="224" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="224" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="224" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="128" y="224" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="160" y="224" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="224" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="224" y="224" width="32" height="32" fill="hsl(216.00,100.00%,50.00%)" />
<rect x="256" y="224" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="288" y="224" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="320" y="224" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="0" y="256" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="256" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="256" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="96" y="256" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="128" y="256" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="256" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="256" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="224" y="256" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="256" y="256" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="288" y="256" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="320" y="256" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="0" y="288" width="32" height="32" fill="hsl(144.00,100.00%,50.00%)" />
<rect x="32" y="288" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="64" y="288" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="96" y="288" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="128" y="288" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="160" y="288" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="288" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="224" y="288" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="256" y="288" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="288" y="288" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="320" y="288" width="32" height="32" fill="hsl(144.00,100.00%,50.00%)" />
<rect x="0" y="0" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="224" y="0" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="256" y="0" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="288" y="0" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="320" y="0" width="32" height="32" fill="hsl(144.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="32" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="256" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="288" y="32" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="320" y="32" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="224" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="256" y="64" width="32" height="32" fill="hsl(192.00,100.00%,50.00%)" />
<rect x="288" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="320" y="64" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="224" y="96" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="256" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="288" y="96" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="320" y="96" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="224" y="128" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="256" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="288" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="320" y="128" width="32" height="32" fill="hsl(168.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="224" y="160" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="256" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="288" y="160" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="320" y="160" width="32" height="32" fill="hsl(216.00,100.00%,50.00%)" />
<rect x="0" y="192" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="32" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="192" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="192" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="160" y="192" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="192" y="192" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="224" y="192" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="256" y="192" width="32" height="32" fill="hsl(192.00,100.00%,50.00%)" />
<rect x="288" y="192" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="320" y="192" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="0" y="224" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="32" y="224" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="224" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="224" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="128" y="224" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="160" y="224" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="224" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="224" y="224" width="32" height="32" fill="hsl(144.00,100.00%,50.00%)" />
<rect x="256" y="224" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="288" y="224" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="320" y="224" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="0" y="256" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="32" y="256" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="256" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="96" y="256" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="128" y="256" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="256" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="256" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="224" y="256" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="256" y="256" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="288" y="256" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="320" y="256" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="0" y="288" width="32" height="32" fill="hsl(216.00,100.00%,50.00%)" />
<rect x="32" y="288" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="64" y="288" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="96" y="288" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="128" y="288" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="288" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="288" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="224" y="288" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="256" y="288" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="288" y="288" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="320" y="288" width="32" height="32" fill="hsl(216.00,100.00%,50.00%)" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.9 KiB

After

Width:  |  Height:  |  Size: 9.0 KiB

84
examples/commithash.svg
View File

@@ -1,44 +1,44 @@
<svg width="224" height="192" xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="0" y="0" width="32" height="32" fill="hsl(168.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.4 KiB

After

Width:  |  Height:  |  Size: 3.5 KiB

84
examples/empty-md5-randomart.svg
View File

@@ -1,44 +1,44 @@
<svg width="224" height="192" xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(168.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(192.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(168.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="0" y="0" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(192.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(168.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(192.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.4 KiB

After

Width:  |  Height:  |  Size: 3.5 KiB

112
examples/empty-sha224-randomart.svg
View File

@@ -1,58 +1,58 @@
<svg width="256" height="224" xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="224" y="0" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="224" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="224" y="64" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="96" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="224" y="128" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="224" y="160" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="0" y="192" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="32" y="192" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="64" y="192" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="96" y="192" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="128" y="192" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="160" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="192" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="0" y="0" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="224" y="0" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="224" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="224" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="96" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="224" y="128" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="224" y="160" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="0" y="192" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="32" y="192" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="64" y="192" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="96" y="192" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="128" y="192" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="192" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.5 KiB

After

Width:  |  Height:  |  Size: 4.6 KiB

112
examples/empty-sha256-randomart.svg
View File

@@ -1,58 +1,58 @@
<svg width="256" height="224" xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(144.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(144.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="224" y="0" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="32" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="64" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(120.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="224" y="96" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="224" y="128" width="32" height="32" fill="hsl(72.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="224" y="160" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="0" y="192" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="32" y="192" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="64" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="96" y="192" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="128" y="192" width="32" height="32" fill="hsl(48.00,100.00%,50.00%)" />
<rect x="160" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="192" y="192" width="32" height="32" fill="hsl(24.00,100.00%,50.00%)" />
<rect x="224" y="192" width="32" height="32" fill="hsl(96.00,100.00%,50.00%)" />
<rect x="0" y="0" width="32" height="32" fill="hsl(0.00,100.00%,50.00%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(216.00,100.00%,50.00%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(216.00,100.00%,50.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="224" y="0" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="32" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="64" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(240.00,100.00%,50.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="224" y="96" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="224" y="128" width="32" height="32" fill="hsl(288.00,100.00%,50.00%)" />
<rect x="0" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="32" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="64" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="96" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="128" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="160" y="160" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="160" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
<rect x="224" y="160" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="0" y="192" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="32" y="192" width="32" height="32" fill="hsl(360.00,100.00%,50.00%)" />
<rect x="64" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="96" y="192" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="128" y="192" width="32" height="32" fill="hsl(312.00,100.00%,50.00%)" />
<rect x="160" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="192" y="192" width="32" height="32" fill="hsl(336.00,100.00%,50.00%)" />
<rect x="224" y="192" width="32" height="32" fill="hsl(264.00,100.00%,50.00%)" />
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.5 KiB

After

Width:  |  Height:  |  Size: 4.6 KiB