/swatches

◼ color swatches for your README as a service.

Primary LanguageJavaScript

SWATCHES

You want to put color swatches in your github README, but it won't render html style attributes, and you can't be bothered to make or host the pngs. What if you could just...

![A lovely hotpink color swatch](https://swatch.now.sh/?color=hotpink)

and have it render as:

A lovely hotpink color swatch

why yes! SVG color swatches as a supernice service thanks to the wonders of now.sh

![Charcoal](https://swatch.now.sh/?color=%2324364C)
![Royal blue](https://swatch.now.sh/?color=%232B60D5)
![Ultramarine blue](https://swatch.now.sh/?color=%23437AF4)
![Bleu de France](https://swatch.now.sh/?color=%234299FF)

Charcoal Royal blue Ultramarine blue Bleu de France

Add your color at the end of the url, get back an svg square.

https://swatch.now.sh/?color=hotpink

For hex codes you have to url encode the # with %23.

https://swatch.now.sh/?color=%234299FF

For hsl() you have to encode the % with %25

https://swatch.now.sh/?color=hsl(52,100%25,20%25)

rbg(), and css color names are fine.

Options

color - an rgb or hsl or css color name. Default: hotpink name - an optional label for your color. Default: the value of color

Development

Install vercel and run

vercel dev

Deployment

Pushes to the default branch are deployed.


A (╯°□°)╯︵TABLEFLIP side project.