/** * 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": "#1A1A1A", "main-color-2": "#2E2E2E", "main-color-3": "#444444", "main-color-4": "#5C5C5C", "main-color-5": "#747474", "main-color-6": "#8E8E8E", "main-color-7": "#A8A8A8", "main-color-8": "#C4C4C4", "main-color-9": "#E0E0E0", "main-color-10": "#FCFCFC", "color-1": { "100": "#E6E6E6", "200": "#CCCCCC", "300": "#B3B3B3", "400": "#999999", "500": "#808080", "600": "#666666", "700": "#4D4D4D", "800": "#333333", "900": "#1A1A1A" }, "color-2": { "100": "#E6E6E6", "200": "#CCCCCC", "300": "#B3B3B3", "400": "#999999", "500": "#808080", "600": "#666666", "700": "#4D4D4D", "800": "#2E2E2E", "900": "#1A1A1A" }, "color-3": { "100": "#E6E6E6", "200": "#CCCCCC", "300": "#B3B3B3", "400": "#999999", "500": "#808080", "600": "#666666", "700": "#444444", "800": "#333333", "900": "#1A1A1A" }, "color-4": { "100": "#E6E6E6", "200": "#CCCCCC", "300": "#B3B3B3", "400": "#999999", "500": "#808080", "600": "#5C5C5C", "700": "#4D4D4D", "800": "#333333", "900": "#1A1A1A" }, "color-5": { "100": "#E6E6E6", "200": "#CCCCCC", "300": "#B3B3B3", "400": "#999999", "500": "#747474", "600": "#666666", "700": "#4D4D4D", "800": "#333333", "900": "#1A1A1A" }, "color-6": { "100": "#E6E6E6", "200": "#CCCCCC", "300": "#B3B3B3", "400": "#8E8E8E", "500": "#808080", "600": "#666666", "700": "#4D4D4D", "800": "#333333", "900": "#1A1A1A" }, "color-7": { "100": "#E6E6E6", "200": "#CCCCCC", "300": "#A8A8A8", "400": "#999999", "500": "#808080", "600": "#666666", "700": "#4D4D4D", "800": "#333333", "900": "#1A1A1A" }, "color-8": { "100": "#E6E6E6", "200": "#C4C4C4", "300": "#B3B3B3", "400": "#999999", "500": "#808080", "600": "#666666", "700": "#4D4D4D", "800": "#333333", "900": "#1A1A1A" }, "color-9": { "100": "#E0E0E0", "200": "#CCCCCC", "300": "#B3B3B3", "400": "#999999", "500": "#808080", "600": "#666666", "700": "#4D4D4D", "800": "#333333", "900": "#1A1A1A" }, "color-10": { "100": "#E6E6E6", "200": "#CCCCCC", "300": "#B3B3B3", "400": "#999999", "500": "#808080", "600": "#666666", "700": "#4D4D4D", "800": "#333333", "900": "#1A1A1A" } } } } }