HTML & CSS · Junior · Question 50 of 75
How does the dark: variant work by default in Tailwind v4?
- 1Only when
<html>has adarkclass added by a script - ✓Correct answer: Based on the system setting - via the
prefers-color-schememedia query - 3Automatically in the evening, based on the user's local clock
Explanation
By default dark: relies on prefers-color-scheme. For a manual theme toggle, the variant is overridden with @custom-variant dark (&:where(.dark, .dark *)); - then the theme depends on a dark class on an ancestor. Tailwind doesn't consider the time of day.