/** * 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": "#F9CEDF", "main-color-2": "#C7E0C3", "main-color-3": "#D5D7F9", "color-1": { "100": "#F9CEDF", "200": "#F4A4C4", "300": "#EE77A6", "400": "#E94988", "500": "#E31C6B", "600": "#B61655", "700": "#881140", "800": "#5B0B2B", "900": "#2D0615" }, "color-2": { "100": "#E0EEDD", "200": "#C7E0C3", "300": "#A1CB9A", "400": "#81BA78", "500": "#62A857", "600": "#4E8745", "700": "#3B6534", "800": "#274323", "900": "#142211" }, "color-3": { "100": "#D5D7F9", "200": "#A6AAF2", "300": "#797FEC", "400": "#4C55E6", "500": "#202ADF", "600": "#1922B3", "700": "#131986", "800": "#0D1159", "900": "#06082D" } } } } }