import colors from "tailwindcss/colors"; /** @type {import("tailwindcss").Config} */ export default { content: ["./src/**/*.{html,js,svelte,ts}"], theme: { extend: { fontFamily: { aladin: ["Aladin", "sans-serif"] } }, colors: { transparent: "transparent", current: "currentColor", black: colors.black, white: colors.white, blue: { 50: "#f3f4fb", 100: "#e3e6f6", 200: "#ced5ef", 300: "#acb8e4", 400: "#8495d6", 500: "#6775ca", 600: "#5158bb", 700: "#494bac", 800: "#41408d", 900: "#383870", 950: "#252546" }, coral: { '50': '#fff1f1', '100': '#ffe0e0', '200': '#ffc5c5', '300': '#ff9e9d', '400': '#ff6665', '500': '#fe4a49', '600': '#ec1716', '700': '#c70f0e', '800': '#a41110', '900': '#881514', '950': '#4a0505', }, teal: { '50': '#eefbf5', '100': '#d6f5e5', '200': '#b1e9d0', '300': '#7ed7b5', '400': '#49be95', '500': '#27a27b', '600': '#188162', '700': '#136951', '800': '#125342', '900': '#104437', '950': '#08261f', }, zinc: { 50: '#fafafa', 100: '#f4f4f5', 200: '#e4e4e7', 300: '#d4d4d8', 400: '#a1a1aa', 500: '#71717a', 600: '#52525b', 700: '#3f3f46', 800: '#27272a', 900: '#18181b', 950: '#09090b', }, }, screens: { sm: "640px", md: "768px", lg: "1024px", xl: "1180px", // >xl removed as site isn't // that dense https://tailwindcss.com/docs/screens } }, plugins: [], safelist: [ // this is pretty sensible, and depended on in src/routes/colors/Color.svelte { pattern: /bg-.+/ } ], corePlugins: { container: false } };