tailwind hocus-pocus

Dec 13, 2024
1 minute to read

Here’s a simple Tailwind plugin that’s become a staple of mine as of late. A cheap way to always get accessible focus styles that just piggyback on your hover styles.

plugins: [
  plugin(function ({ addVariant }) {
    addVariant('hocus', ['&:hover', '&:focus'])
    addVariant('group-hocus', ['.group:hover &', '.group:focus &'])
  }),
]