/** * 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": "#330033", "main-color-2": "#340B00", "main-color-3": "#002300", "main-color-4": "#002243", "color-1": { "100": "#FFCCFF", "200": "#FF99FF", "300": "#FF66FF", "400": "#FF33FF", "500": "#FF00FF", "600": "#CC00CC", "700": "#990099", "800": "#660066", "900": "#330033" }, "color-2": { "100": "#FFD7CC", "200": "#FFAF99", "300": "#FF8666", "400": "#FF5E33", "500": "#FF3600", "600": "#CC2B00", "700": "#992000", "800": "#661600", "900": "#340B00" }, "color-3": { "100": "#CCFFCC", "200": "#99FF99", "300": "#66FF66", "400": "#33FF33", "500": "#00FF00", "600": "#00CC00", "700": "#009900", "800": "#006600", "900": "#002300" }, "color-4": { "100": "#CCE6FF", "200": "#99CDFF", "300": "#66B4FF", "400": "#339BFF", "500": "#0081FF", "600": "#0068CC", "700": "#004E99", "800": "#003466", "900": "#002243" } } } } }