JSPM

tailwindcss-accessibility

1.0.0
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 113
  • Score
    100M100P100Q67813F
  • License MIT

A Tailwind CSS plugin that adds additional functionality to help improve accessibility.

Package Exports

  • tailwindcss-accessibility

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (tailwindcss-accessibility) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Tailwind CSS Accessibility Plugin

A Tailwind CSS plugin that adds additional functionality to help improve accessibility.

Installing

npm install tailwindcss-accessibility

or

yarn add tailwindcss-accessibility

Simply require the installed plugin directly to your Tailwind config:

plugins: [
  require('tailwindcss-accessibility')
]

Usage

For usage on individual elements:

<span class="sr-only">
  Screen readers only
</span>

Use on focused only elements (skip links etc):

<a class="sr-only sr-only-focusable" href="#content" tabindex="1">
  Skip to main content
</a>

Utilities

By default the class utils are taken from Bootstrap 4, a highly battle-tested framework:

.sr-only {}
.sr-only-focusable {}

Contributions

The goal of this project is to be a single source for as many relevant CSS accessibility helpers as possible. If we're missing something, or you would like to contribute, post an issue or PR.