/** * 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": "#91961A", "main-color-2": "#00ABAB", "main-color-3": "#5C8CF7", "main-color-4": "#F25E78", "color-1": { "100": "#F6F7D4", "200": "#EDF0A8", "300": "#E4E87D", "400": "#DBE151", "500": "#D2D926", "600": "#A8AE1E", "700": "#91961A", "800": "#54570F", "900": "#2A2B08" }, "color-2": { "100": "#CCFFFF", "200": "#99FFFF", "300": "#66FFFF", "400": "#33FFFF", "500": "#00FFFF", "600": "#00CCCC", "700": "#00ABAB", "800": "#006666", "900": "#003333" }, "color-3": { "100": "#CEDDFD", "200": "#9EBAFA", "300": "#5C8CF7", "400": "#3D76F5", "500": "#0C54F3", "600": "#0A43C2", "700": "#073292", "800": "#052161", "900": "#021131" }, "color-4": { "100": "#FBD0D7", "200": "#F7A1B0", "300": "#F25E78", "400": "#F04261", "500": "#EC1339", "600": "#BD0F2E", "700": "#8E0B22", "800": "#5E0817", "900": "#2F040B" } } } } }