Mark2810's avatar

Tailwind dark:{class} does not execute custom classes.

Hi, I have this weird thing and I can't find anything about it, but dark:text-white for example works great but when I do: dark:myCustomClass, it does not work. But when I put my myCustomClass on a div without "dark:" infront of it, it works fine. Am I missing something?

My tailwind.config.js contains darkMode: 'class' . besides that I don't see any other requirements.

What can I do to fix this? Did I miss something in the docs about custom classes?

Thank you.

0 likes
2 replies
Mark2810's avatar

@Sinnbeck

const defaultTheme = require('tailwindcss/defaultTheme');

/** @type {import('tailwindcss').Config} */
module.exports = {
    darkMode: 'class',
    content: [
        './src/**/*.{html,js}', './node_modules/tw-elements/dist/js/**/*.js',
        './vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
        './vendor/laravel/jetstream/**/*.blade.php',
        './storage/framework/views/*.php',
        './resources/views/**/*.blade.php',
    ],

    theme: {
        extend: {
            fontFamily: {
                sans: ['Nunito', ...defaultTheme.fontFamily.sans],
            },
        },
    },

    plugins: [require('@tailwindcss/forms'), require('@tailwindcss/typography'), require('tw-elements/dist/plugin')],
};

Please or to participate in this conversation.