Tailwind offers the possibility to apply a utility class only in some situations through media queries, which is called a variant. The main use of variants is to design a responsive interface for various screen sizes. There are also variants for the different states an element can have, such as for when hovered, when keyboard selected or when in use, or when the browser or operating system has dark mode enabled.
