TALL Tales

Home About Resources Reference Posts Contact

How to Add Colours to your Tailwind Palette

13 Oct, 2021

SNIPPPET

TAILWIND

To add new colours to the default Tailwind palette is pretty straightforward.

Firstly, open the tailwind.config.js file.

Go to the theme section and then add in your colours like so:

theme: {
        extend: {
            colors: {
                // maroon
                'maroon' : '#8E1000',
								
                // grey
                'dark-gray': '#363F51',
            },
        },
    },

Once you have added the colours and saved your file, run this in your Terminal:

npm run dev

and you will now be able to use your new colours as you would any other.

Image by Photo by Robert Katzki on Unsplash

Did this article help you? Say thanks by buying me a coffee!