diff --git a/exampleSite/content/docs/advanced-customisation/index.md b/exampleSite/content/docs/advanced-customisation/index.md index 31952d6d..a94399e5 100644 --- a/exampleSite/content/docs/advanced-customisation/index.md +++ b/exampleSite/content/docs/advanced-customisation/index.md @@ -55,6 +55,11 @@ Blowfish ships with a number of colour schemes out of the box. To change the bas In addition to the default schemes, you can also create your own and re-style the entire website to your liking. Schemes are created by by placing a `.css` file in the `assets/css/schemes/` folder. Once the file is created, simply refer to it by name in the theme configuration. +{{< alert "github">}} +**Note:** generating these files manually can be hard, I've built a `nodejs` terminal tool to help with that, [Fugu](https://github.com/nunocoracao/fugu). In a nutshell, you pass the main three `hex` values of your color pallette and the program will output a css file that can be imported directly into Blowfish. +{{< /alert >}} + + Blowfish defines a three-colour palette that is used throughout the theme. The three colours are defined as `neutral`, `primary` and `secondary` variants, each containing ten shades of colour. Due to the way Tailwind CSS 3.0 calculates colour values with opacity, the colours specified in the scheme need to [conform to a particular format](https://github.com/adamwathan/tailwind-css-variable-text-opacity-demo) by providing the red, green and blue colour values.