Update README to include note about palette selection

Signed-off-by: Alek Ratzloff <alekratz@gmail.com>
This commit is contained in:
2024-08-02 10:28:52 -07:00
parent b5498b18be
commit 71cf881305
2 changed files with 48 additions and 40 deletions

View File

@@ -50,6 +50,14 @@ same color palette, for example. Additionally, if this is appearing on a webpage
override the most recent version of the file; this has happened with me and Chrome looking at the override the most recent version of the file; this has happened with me and Chrome looking at the
Github page for this project. Github page for this project.
Palette selection is questionable. It's mostly based on the hash itself, but the colors chosen are
sort of arbitrary, and certain color profiles are omitted based on the author's personal taste. For
example, the color palette for "light yellow" is omitted because it's hard to look at and
distinguish, while dark yellow is kept because it doesn't have that problem. If palettes are ever
removed or added in the future, this will have a cascading effect on palette selection, since this
is done by taking the sum of all of the bytes in the hash mod the number of palettes available. As
the software evolves, a colorhash made 5 years ago may have a different look today.
# Examples # Examples
See the examples directory. See the examples directory.

View File

@@ -1,42 +1,42 @@
<svg width="256" height="160" xmlns="http://www.w3.org/2000/svg"> <svg width="256" height="160" xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="32" height="32" fill="hsl(30.00,100.00%,63.33%)" /> <rect x="0" y="0" width="32" height="32" fill="hsl(0.00,0.00%,36.67%)" />
<rect x="32" y="0" width="32" height="32" fill="hsl(30.00,100.00%,83.33%)" /> <rect x="32" y="0" width="32" height="32" fill="hsl(0.00,0.00%,16.67%)" />
<rect x="64" y="0" width="32" height="32" fill="hsl(30.00,100.00%,73.33%)" /> <rect x="64" y="0" width="32" height="32" fill="hsl(0.00,0.00%,13.33%)" />
<rect x="96" y="0" width="32" height="32" fill="hsl(30.00,100.00%,86.67%)" /> <rect x="96" y="0" width="32" height="32" fill="hsl(0.00,0.00%,30.00%)" />
<rect x="128" y="0" width="32" height="32" fill="hsl(30.00,100.00%,50.00%)" /> <rect x="128" y="0" width="32" height="32" fill="hsl(0.00,0.00%,26.67%)" />
<rect x="160" y="0" width="32" height="32" fill="hsl(30.00,100.00%,90.00%)" /> <rect x="160" y="0" width="32" height="32" fill="hsl(0.00,0.00%,36.67%)" />
<rect x="192" y="0" width="32" height="32" fill="hsl(30.00,100.00%,90.00%)" /> <rect x="192" y="0" width="32" height="32" fill="hsl(0.00,0.00%,3.33%)" />
<rect x="224" y="0" width="32" height="32" fill="hsl(30.00,100.00%,50.00%)" /> <rect x="224" y="0" width="32" height="32" fill="hsl(0.00,0.00%,26.67%)" />
<rect x="0" y="32" width="32" height="32" fill="hsl(30.00,100.00%,50.00%)" /> <rect x="0" y="32" width="32" height="32" fill="hsl(0.00,0.00%,36.67%)" />
<rect x="32" y="32" width="32" height="32" fill="hsl(30.00,100.00%,50.00%)" /> <rect x="32" y="32" width="32" height="32" fill="hsl(0.00,0.00%,46.67%)" />
<rect x="64" y="32" width="32" height="32" fill="hsl(30.00,100.00%,83.33%)" /> <rect x="64" y="32" width="32" height="32" fill="hsl(0.00,0.00%,6.67%)" />
<rect x="96" y="32" width="32" height="32" fill="hsl(30.00,100.00%,80.00%)" /> <rect x="96" y="32" width="32" height="32" fill="hsl(0.00,0.00%,43.33%)" />
<rect x="128" y="32" width="32" height="32" fill="hsl(30.00,100.00%,100.00%)" /> <rect x="128" y="32" width="32" height="32" fill="hsl(0.00,0.00%,0.00%)" />
<rect x="160" y="32" width="32" height="32" fill="hsl(30.00,100.00%,66.67%)" /> <rect x="160" y="32" width="32" height="32" fill="hsl(0.00,0.00%,36.67%)" />
<rect x="192" y="32" width="32" height="32" fill="hsl(30.00,100.00%,60.00%)" /> <rect x="192" y="32" width="32" height="32" fill="hsl(0.00,0.00%,13.33%)" />
<rect x="224" y="32" width="32" height="32" fill="hsl(30.00,100.00%,73.33%)" /> <rect x="224" y="32" width="32" height="32" fill="hsl(0.00,0.00%,26.67%)" />
<rect x="0" y="64" width="32" height="32" fill="hsl(30.00,100.00%,50.00%)" /> <rect x="0" y="64" width="32" height="32" fill="hsl(0.00,0.00%,16.67%)" />
<rect x="32" y="64" width="32" height="32" fill="hsl(30.00,100.00%,96.67%)" /> <rect x="32" y="64" width="32" height="32" fill="hsl(0.00,0.00%,0.00%)" />
<rect x="64" y="64" width="32" height="32" fill="hsl(30.00,100.00%,73.33%)" /> <rect x="64" y="64" width="32" height="32" fill="hsl(0.00,0.00%,20.00%)" />
<rect x="96" y="64" width="32" height="32" fill="hsl(30.00,100.00%,100.00%)" /> <rect x="96" y="64" width="32" height="32" fill="hsl(0.00,0.00%,40.00%)" />
<rect x="128" y="64" width="32" height="32" fill="hsl(30.00,100.00%,63.33%)" /> <rect x="128" y="64" width="32" height="32" fill="hsl(0.00,0.00%,46.67%)" />
<rect x="160" y="64" width="32" height="32" fill="hsl(30.00,100.00%,93.33%)" /> <rect x="160" y="64" width="32" height="32" fill="hsl(0.00,0.00%,33.33%)" />
<rect x="192" y="64" width="32" height="32" fill="hsl(30.00,100.00%,90.00%)" /> <rect x="192" y="64" width="32" height="32" fill="hsl(0.00,0.00%,23.33%)" />
<rect x="224" y="64" width="32" height="32" fill="hsl(30.00,100.00%,50.00%)" /> <rect x="224" y="64" width="32" height="32" fill="hsl(0.00,0.00%,10.00%)" />
<rect x="0" y="96" width="32" height="32" fill="hsl(30.00,100.00%,50.00%)" /> <rect x="0" y="96" width="32" height="32" fill="hsl(0.00,0.00%,0.00%)" />
<rect x="32" y="96" width="32" height="32" fill="hsl(30.00,100.00%,56.67%)" /> <rect x="32" y="96" width="32" height="32" fill="hsl(0.00,0.00%,46.67%)" />
<rect x="64" y="96" width="32" height="32" fill="hsl(30.00,100.00%,63.33%)" /> <rect x="64" y="96" width="32" height="32" fill="hsl(0.00,0.00%,16.67%)" />
<rect x="96" y="96" width="32" height="32" fill="hsl(30.00,100.00%,50.00%)" /> <rect x="96" y="96" width="32" height="32" fill="hsl(0.00,0.00%,26.67%)" />
<rect x="128" y="96" width="32" height="32" fill="hsl(30.00,100.00%,56.67%)" /> <rect x="128" y="96" width="32" height="32" fill="hsl(0.00,0.00%,30.00%)" />
<rect x="160" y="96" width="32" height="32" fill="hsl(30.00,100.00%,63.33%)" /> <rect x="160" y="96" width="32" height="32" fill="hsl(0.00,0.00%,50.00%)" />
<rect x="192" y="96" width="32" height="32" fill="hsl(30.00,100.00%,63.33%)" /> <rect x="192" y="96" width="32" height="32" fill="hsl(0.00,0.00%,26.67%)" />
<rect x="224" y="96" width="32" height="32" fill="hsl(30.00,100.00%,76.67%)" /> <rect x="224" y="96" width="32" height="32" fill="hsl(0.00,0.00%,43.33%)" />
<rect x="0" y="128" width="32" height="32" fill="hsl(30.00,100.00%,83.33%)" /> <rect x="0" y="128" width="32" height="32" fill="hsl(0.00,0.00%,30.00%)" />
<rect x="32" y="128" width="32" height="32" fill="hsl(30.00,100.00%,86.67%)" /> <rect x="32" y="128" width="32" height="32" fill="hsl(0.00,0.00%,0.00%)" />
<rect x="64" y="128" width="32" height="32" fill="hsl(30.00,100.00%,90.00%)" /> <rect x="64" y="128" width="32" height="32" fill="hsl(0.00,0.00%,10.00%)" />
<rect x="96" y="128" width="32" height="32" fill="hsl(30.00,100.00%,66.67%)" /> <rect x="96" y="128" width="32" height="32" fill="hsl(0.00,0.00%,26.67%)" />
<rect x="128" y="128" width="32" height="32" fill="hsl(30.00,100.00%,100.00%)" /> <rect x="128" y="128" width="32" height="32" fill="hsl(0.00,0.00%,36.67%)" />
<rect x="160" y="128" width="32" height="32" fill="hsl(30.00,100.00%,100.00%)" /> <rect x="160" y="128" width="32" height="32" fill="hsl(0.00,0.00%,20.00%)" />
<rect x="192" y="128" width="32" height="32" fill="hsl(30.00,100.00%,70.00%)" /> <rect x="192" y="128" width="32" height="32" fill="hsl(0.00,0.00%,50.00%)" />
<rect x="224" y="128" width="32" height="32" fill="hsl(30.00,100.00%,96.67%)" /> <rect x="224" y="128" width="32" height="32" fill="hsl(0.00,0.00%,6.67%)" />
</svg> </svg>

Before

Width:  |  Height:  |  Size: 3.3 KiB

After

Width:  |  Height:  |  Size: 3.1 KiB