Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dark color scheme support (via prefers-color-scheme media query) #24

Open
zenojunior opened this issue Feb 25, 2020 · 0 comments
Open

Comments

@zenojunior
Copy link

Well, many operating systems now support a dark mode or dark theme.

I believe it would be interesting for this to be implemented here as well.

The media consultation of the preferred color scheme allows you to adjust the appearance of the website to match the user's preferred mode.

Syntax

no-preference Indicates that the user has made no preference known to the system. This keyword value evaluates to false in the boolean context.
light Indicates that user has notified the system that they prefer an interface that has a light theme.
dark Indicates that user has notified the system that they prefer an interface that has a dark theme.

Mozilla Firefox: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme
Google Chrome: https://www.chromestatus.com/feature/5109758977638400

Suggestion

  ${media.prefersColorScheme("dark")`
    body {
      background-color: black;
      color: white;
    }
  `}

What do you think about it?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant