/** * 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": "#00A152", "main-color-2": "#008738", "main-color-3": "#006B21", "main-color-4": "#00520A", "main-color-5": "#003B00", "main-color-6": "#002400", "main-color-7": "#000000", "color-1": { "100": "#CCFFE6", "200": "#99FFCD", "300": "#66FFB4", "400": "#33FF9B", "500": "#00FF82", "600": "#00CC68", "700": "#00A152", "800": "#006634", "900": "#00331A" }, "color-2": { "100": "#CCFFE1", "200": "#99FFC3", "300": "#66FFA5", "400": "#33FF88", "500": "#00FF6A", "600": "#00CC55", "700": "#008738", "800": "#00662A", "900": "#003315" }, "color-3": { "100": "#CCFFDC", "200": "#99FFB8", "300": "#66FF95", "400": "#33FF72", "500": "#00FF4F", "600": "#00CC3F", "700": "#00992F", "800": "#006B21", "900": "#003310" }, "color-4": { "100": "#CCFFD2", "200": "#99FFA5", "300": "#66FF79", "400": "#33FF4C", "500": "#00FF1F", "600": "#00CC19", "700": "#009913", "800": "#00520A", "900": "#003306" }, "color-5": { "100": "#CCFFCC", "200": "#99FF99", "300": "#66FF66", "400": "#33FF33", "500": "#00FF00", "600": "#00CC00", "700": "#009900", "800": "#006600", "900": "#003B00" }, "color-6": { "100": "#CCFFCC", "200": "#99FF99", "300": "#66FF66", "400": "#33FF33", "500": "#00FF00", "600": "#00CC00", "700": "#009900", "800": "#006600", "900": "#002400" }, "color-7": { "100": "#E6E6E6", "200": "#CCCCCC", "300": "#B3B3B3", "400": "#999999", "500": "#808080", "600": "#666666", "700": "#4D4D4D", "800": "#333333", "900": "#1A1A1A" } } } } }