/** * 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": "#F2F2F2", "main-color-2": "#F2DADA", "main-color-3": "#F2C2C2", "main-color-4": "#F2A9A9", "main-color-5": "#F29191", "main-color-6": "#F27979", "main-color-7": "#F26161", "main-color-8": "#F24949", "main-color-9": "#F23030", "main-color-10": "#F21818", "color-1": { "100": "#F2F2F2", "200": "#CCCCCC", "300": "#B3B3B3", "400": "#999999", "500": "#808080", "600": "#666666", "700": "#4D4D4D", "800": "#333333", "900": "#1A1A1A" }, "color-2": { "100": "#F2DADA", "200": "#E4B4B4", "300": "#D78E8E", "400": "#CA6868", "500": "#BD4242", "600": "#973535", "700": "#712828", "800": "#4B1B1B", "900": "#260D0D" }, "color-3": { "100": "#F2C2C2", "200": "#EDABAB", "300": "#E48181", "400": "#DB5757", "500": "#D22D2D", "600": "#A82424", "700": "#7E1B1B", "800": "#541212", "900": "#2A0909" }, "color-4": { "100": "#F8D3D3", "200": "#F2A9A9", "300": "#EB7A7A", "400": "#E44E4E", "500": "#DE2121", "600": "#B11B1B", "700": "#851414", "800": "#590D0D", "900": "#2C0707" }, "color-5": { "100": "#FAD1D1", "200": "#F29191", "300": "#EF7676", "400": "#E94949", "500": "#E41B1B", "600": "#B61616", "700": "#891010", "800": "#5B0B0B", "900": "#2E0505" }, "color-6": { "100": "#FAD1D1", "200": "#F6A2A2", "300": "#F27979", "400": "#ED4545", "500": "#E81717", "600": "#BA1212", "700": "#8B0E0E", "800": "#5D0909", "900": "#2E0505" }, "color-7": { "100": "#FBD0D0", "200": "#F7A1A1", "300": "#F26161", "400": "#EF4343", "500": "#EC1313", "600": "#BC1010", "700": "#8D0C0C", "800": "#5E0808", "900": "#2F0404" }, "color-8": { "100": "#FCCFCF", "200": "#F8A0A0", "300": "#F57070", "400": "#F24949", "500": "#EE1111", "600": "#BE0E0E", "700": "#8F0A0A", "800": "#5F0707", "900": "#300303" }, "color-9": { "100": "#FCCFCF", "200": "#F99F9F", "300": "#F66F6F", "400": "#F23030", "500": "#F00F0F", "600": "#C00C0C", "700": "#900909", "800": "#600606", "900": "#300303" }, "color-10": { "100": "#FCCFCF", "200": "#FA9E9E", "300": "#F76E6E", "400": "#F43E3E", "500": "#F21818", "600": "#C10B0B", "700": "#910808", "800": "#610505", "900": "#300303" } } } } }