Skip to content

Instantly share code, notes, and snippets.

@jan-heise
Created April 22, 2020 06:56
Show Gist options
  • Save jan-heise/c33b56ef9743ce5d7bfeadaccf0aea78 to your computer and use it in GitHub Desktop.
Save jan-heise/c33b56ef9743ce5d7bfeadaccf0aea78 to your computer and use it in GitHub Desktop.
Enable Darkmode Variants in TailwindUI depending on OS / Browser Settings

Enable Darkmode Variants in TailwindUI depending on OS / Browser Settings

To enable darkmode variants simply add the following lines to the theme/extend section of your tailwind config

screens: {
    'dark-mode': {'raw': '(prefers-color-scheme: dark)'},
},

This enables the dark-mode variant for your classes. You are now able to use dark-mode:bg-gray-900 on your site.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment