tailwind.config.mjs

/** @type {import('tailwindcss').Config} */

export default {
    content: ["./src/**/*.{mjs,js,ts,jsx,tsx}"],
    theme: {
        // Remove default colors
        colors: {},
        extend: {
            // Add ENS colors (light/dark dependent)
            colors: {
                "blue-primary": "var(--thorin-blue-primary)",
                "blue-active": "var(--thorin-blue-active)",
                "blue-dim": "var(--thorin-blue-dim)",
                "blue-bright": "var(--thorin-blue-bright)",
                "blue-light": "var(--thorin-blue-light)",
                "blue-surface": "var(--thorin-blue-surface)",
                "indigo-primary": "var(--thorin-indigo-primary)",
                "indigo-active": "var(--thorin-indigo-active)",
                "indigo-dim": "var(--thorin-indigo-dim)",
                "indigo-bright": "var(--thorin-indigo-bright)",
                "indigo-light": "var(--thorin-indigo-light)",
                "indigo-surface": "var(--thorin-indigo-surface)",
                "purple-primary": "var(--thorin-purple-primary)",
                "purple-active": "var(--thorin-purple-active)",
                "purple-dim": "var(--thorin-purple-dim)",
                "purple-bright": "var(--thorin-purple-bright)",
                "purple-light": "var(--thorin-purple-light)",
                "purple-surface": "var(--thorin-purple-surface)",
                "pink-primary": "var(--thorin-pink-primary)",
                "pink-active": "var(--thorin-pink-active)",
                "pink-dim": "var(--thorin-pink-dim)",
                "pink-bright": "var(--thorin-pink-bright)",
                "pink-light": "var(--thorin-pink-light)",
                "pink-surface": "var(--thorin-pink-surface)",
                "red-primary": "var(--thorin-red-primary)",
                "red-active": "var(--thorin-red-active)",
                "red-dim": "var(--thorin-red-dim)",
                "red-bright": "var(--thorin-red-bright)",
                "red-light": "var(--thorin-red-light)",
                "red-surface": "var(--thorin-red-surface)",
                "orange-primary": "var(--thorin-orange-primary)",
                "orange-active": "var(--thorin-orange-active)",
                "orange-dim": "var(--thorin-orange-dim)",
                "orange-bright": "var(--thorin-orange-bright)",
                "orange-light": "var(--thorin-orange-light)",
                "orange-surface": "var(--thorin-orange-surface)",
                "yellow-primary": "var(--thorin-yellow-primary)",
                "yellow-active": "var(--thorin-yellow-active)",
                "yellow-dim": "var(--thorin-yellow-dim)",
                "yellow-bright": "var(--thorin-yellow-bright)",
                "yellow-light": "var(--thorin-yellow-light)",
                "yellow-surface": "var(--thorin-yellow-surface)",
                "green-primary": "var(--thorin-green-primary)",
                "green-active": "var(--thorin-green-active)",
                "green-dim": "var(--thorin-green-dim)",
                "green-bright": "var(--thorin-green-bright)",
                "green-light": "var(--thorin-green-light)",
                "green-surface": "var(--thorin-green-surface)",
                "grey-primary": "var(--thorin-grey-primary)",
                "grey-active": "var(--thorin-grey-active)",
                "grey-dim": "var(--thorin-grey-dim)",
                "grey-bright": "var(--thorin-grey-bright)",
                "grey-light": "var(--thorin-grey-light)",
                "grey-surface": "var(--thorin-grey-surface)",
                "text-primary": "var(--thorin-text-primary)",
                "text-secondary": "var(--thorin-text-secondary)",
                "text-accent": "var(--thorin-text-accent)",
                "text-disabled": "var(--thorin-text-disabled)",
                "background-primary": "var(--thorin-background-primary)",
                "background-secondary": "var(--thorin-background-secondary)",
                "background-disabled": "var(--thorin-background-disabled)",
                border: "var(--thorin-border)"
            }
        }
    },
    plugins: []
};