/** * 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": "#EDC4F2", "main-color-2": "#FFBEC7", "main-color-3": "#B1DCB0", "main-color-4": "#88E0DC", "color-1": { "100": "#EDC4F2", "200": "#E5ABED", "300": "#D982E3", "400": "#CC58DA", "500": "#BF2ED1", "600": "#9925A7", "700": "#731C7D", "800": "#4C1254", "900": "#26092A" }, "color-2": { "100": "#FFBEC7", "200": "#FF99A7", "300": "#FF667B", "400": "#FF334F", "500": "#FF0023", "600": "#CC001C", "700": "#990015", "800": "#66000E", "900": "#330007" }, "color-3": { "100": "#DCEFDC", "200": "#B1DCB0", "300": "#96D095", "400": "#73C072", "500": "#51B14E", "600": "#408D3F", "700": "#306A2F", "800": "#20471F", "900": "#102310" }, "color-4": { "100": "#D7F4F3", "200": "#AEEAE7", "300": "#88E0DC", "400": "#5DD5CF", "500": "#35CAC4", "600": "#2AA29C", "700": "#207975", "800": "#15514E", "900": "#0B2827" } } } } }