/** * To use these colors in Tailwind, you need to extend your tailwind.config.js file. * * For details see: * https://tailwindcss.com/docs/customizing-colors/#extending-the-default-palette * * To use own names for the colors, change the node names "main-color-*" and "color-*". */ { "theme": { "extend": { "colors": { "main-color-1": "#B6E3D3", "main-color-2": "#D5D7F9", "main-color-3": "#F9D1BF", "color-1": { "100": "#DAF1E9", "200": "#B6E3D3", "300": "#90D5BC", "400": "#6CC6A6", "500": "#47B890", "600": "#399373", "700": "#2A6F56", "800": "#1C4A3A", "900": "#0E251D" }, "color-2": { "100": "#D5D7F9", "200": "#A6AAF2", "300": "#797FEC", "400": "#4C55E6", "500": "#202ADF", "600": "#1922B3", "700": "#131986", "800": "#0D1159", "900": "#06082D" }, "color-3": { "100": "#F9D1BF", "200": "#F6BCA2", "300": "#F29A73", "400": "#EE7944", "500": "#E95716", "600": "#BB4611", "700": "#8C340D", "800": "#5D2309", "900": "#2F1104" } } } } }