/** * 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": "#F7D2C3", "main-color-2": "#F7E4DC", "main-color-3": "#F7F5F4", "main-color-4": "#F7FFFF", "color-1": { "100": "#F7D2C3", "200": "#F3BCA5", "300": "#ED9A78", "400": "#E7784B", "500": "#E1561E", "600": "#B44518", "700": "#873412", "800": "#5A220C", "900": "#2D1106" }, "color-2": { "100": "#F7E4DC", "200": "#ECBFAC", "300": "#E39F82", "400": "#D97F59", "500": "#D05F2F", "600": "#A64C26", "700": "#7D391C", "800": "#532613", "900": "#2A1309" }, "color-3": { "100": "#EAE4E1", "200": "#D4C9C4", "300": "#BFAEA6", "400": "#A99489", "500": "#94796B", "600": "#766156", "700": "#594840", "800": "#3B302B", "900": "#1E1815" }, "color-4": { "100": "#CCFFFF", "200": "#99FFFF", "300": "#66FFFF", "400": "#33FFFF", "500": "#00FFFF", "600": "#00CCCC", "700": "#009999", "800": "#006666", "900": "#003333" } } } } }