Tailwind color palette

Change color to generate a new palette (you can set the color to any format supported by chroma.js).

Darkest

Darker

Dark

Color

Invalid color!

Light

Lighter

Lightest

Variable name

"{{ varName }}-darkest": "{{ darkest }}",
"{{ varName }}-darker": "{{ darker }}",
"{{ varName }}-dark": "{{ dark }}",
"{{ varName }}": "{{ swatch }}",
"{{ varName }}-light": "{{ light }}",
"{{ varName }}-lighter": "{{ lighter }}",
"{{ varName }}-lightest": "{{ lightest }}"

All code is inline. You can save this file and make it yours. :)