/** * 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": "#4D5454", "main-color-2": "#455454", "main-color-3": "#3C5454", "main-color-4": "#345453", "main-color-5": "#2B5453", "main-color-6": "#235453", "main-color-7": "#1A5453", "main-color-8": "#125453", "main-color-9": "#0A5452", "main-color-10": "#015452", "color-1": { "100": "#E4E7E7", "200": "#CACECE", "300": "#AFB6B6", "400": "#959D9D", "500": "#7A8585", "600": "#626A6A", "700": "#4D5454", "800": "#313535", "900": "#181B1B" }, "color-2": { "100": "#E3E8E8", "200": "#C7D1D1", "300": "#ABBABA", "400": "#8FA3A3", "500": "#738C8C", "600": "#5C7070", "700": "#455454", "800": "#2E3838", "900": "#171C1C" }, "color-3": { "100": "#E1EAEA", "200": "#C4D5D5", "300": "#A6BFBF", "400": "#88AAAA", "500": "#6A9595", "600": "#557777", "700": "#3C5454", "800": "#2B3B3B", "900": "#151E1E" }, "color-4": { "100": "#E0ECEB", "200": "#C0D8D7", "300": "#A1C4C3", "400": "#81B1B0", "500": "#629E9C", "600": "#4E7E7D", "700": "#345453", "800": "#273F3E", "900": "#14201F" }, "color-5": { "100": "#DDEEED", "200": "#BCDCDC", "300": "#9ACBCA", "400": "#78BAB8", "500": "#56A9A7", "600": "#458785", "700": "#346564", "800": "#2B5453", "900": "#112221" }, "color-6": { "100": "#DBF0F0", "200": "#B7E1E0", "300": "#93D2D1", "400": "#6FC3C1", "500": "#4BB4B2", "600": "#3C908E", "700": "#2D6C6B", "800": "#235453", "900": "#0F2424" }, "color-7": { "100": "#D8F3F2", "200": "#B1E7E6", "300": "#8ADBD9", "400": "#63CFCD", "500": "#3CC3C0", "600": "#309C9A", "700": "#247573", "800": "#1A5453", "900": "#0C2726" }, "color-8": { "100": "#D5F6F5", "200": "#ABEDEC", "300": "#81E4E3", "400": "#57DBD9", "500": "#2DD2D0", "600": "#24A8A6", "700": "#1B7E7D", "800": "#125453", "900": "#092A2A" }, "color-9": { "100": "#D1FAF8", "200": "#A4F4F2", "300": "#76EFEB", "400": "#49E9E5", "500": "#1BE4DE", "600": "#16B6B2", "700": "#108985", "800": "#0A5452", "900": "#052E2C" }, "color-10": { "100": "#CDFEFD", "200": "#9AFEFB", "300": "#68FDFA", "400": "#35FDF8", "500": "#03FCF6", "600": "#02CAC5", "700": "#029794", "800": "#015452", "900": "#013231" } } } } }