/** * 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": "#D3D3D3", "main-color-2": "#D3E8E8", "main-color-3": "#D3FDFD", "main-color-4": "#D3FFFF", "color-1": { "100": "#E6E6E6", "200": "#D3D3D3", "300": "#B3B3B3", "400": "#999999", "500": "#808080", "600": "#666666", "700": "#4D4D4D", "800": "#333333", "900": "#1A1A1A" }, "color-2": { "100": "#D3E8E8", "200": "#BCDCDC", "300": "#9BCACA", "400": "#79B9B9", "500": "#58A7A7", "600": "#468686", "700": "#356464", "800": "#234343", "900": "#122121" }, "color-3": { "100": "#D3FDFD", "200": "#9DFBFB", "300": "#6DF8F8", "400": "#3CF6F6", "500": "#0BF4F4", "600": "#09C3C3", "700": "#079292", "800": "#046262", "900": "#023131" }, "color-4": { "100": "#D3FFFF", "200": "#99FFFF", "300": "#66FFFF", "400": "#33FFFF", "500": "#00FFFF", "600": "#00CCCC", "700": "#009999", "800": "#006666", "900": "#003333" } } } } }