Skip to content

Instantly share code, notes, and snippets.

@danielstgt

danielstgt/app.css

Created December 25, 2021 02:01
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save danielstgt/fbd1b277fb8e0adbf4131ec3181d6b10 to your computer and use it in GitHub Desktop.
Save danielstgt/fbd1b277fb8e0adbf4131ec3181d6b10 to your computer and use it in GitHub Desktop.
Download ZIP
CSS text rendering based on hover detection
Raw
app.css
/* is not a touch device */
@media (hover: hover) {
body { text-rendering: optimizeLegibility; }
}
/* is a touch device */
@media (hover: none) {
body { text-rendering: optimizeSpeed; }
}
@danielstgt
Copy link
Author

Tailwind CSS Usage / Base Layer

@layer base {
    /* is not a touch device */
    @media (hover: hover) {
        body { text-rendering: optimizeLegibility; }
    }

    /* is a touch device */
    @media (hover: none) {
        body { text-rendering: optimizeSpeed; }
    }
}

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