/** * 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": "#C2DDF7", "main-color-2": "#F7D2C3", "main-color-3": "#B2E3E3", "color-1": { "100": "#C2DDF7", "200": "#A5CDF3", "300": "#78B4ED", "400": "#4B9AE7", "500": "#1E81E1", "600": "#1867B4", "700": "#124E87", "800": "#0C345A", "900": "#061A2D" }, "color-2": { "100": "#F7D2C3", "200": "#F3BCA5", "300": "#ED9A78", "400": "#E7784B", "500": "#E1561E", "600": "#B44518", "700": "#873412", "800": "#5A220C", "900": "#2D1106" }, "color-3": { "100": "#DAF1F1", "200": "#B2E3E3", "300": "#8FD6D6", "400": "#69C9C9", "500": "#44BBBB", "600": "#369696", "700": "#297070", "800": "#1B4B4B", "900": "#0E2525" } } } } }