https://github.com/cityssm/bulma-a11y
Bulma with increased colour contrast to meet accessibility requirements.
https://github.com/cityssm/bulma-a11y
a11y accessibility bulma css css-framework hacktoberfest
Last synced: about 1 month ago
JSON representation
Bulma with increased colour contrast to meet accessibility requirements.
- Host: GitHub
- URL: https://github.com/cityssm/bulma-a11y
- Owner: cityssm
- License: mit
- Created: 2020-12-22T15:20:42.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2023-03-06T22:59:50.000Z (about 2 years ago)
- Last Synced: 2025-03-17T21:13:22.688Z (about 2 months ago)
- Topics: a11y, accessibility, bulma, css, css-framework, hacktoberfest
- Language: HTML
- Homepage: https://www.npmjs.com/package/@cityssm/bulma-a11y
- Size: 734 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 11
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# bulma-a11y
[](https://www.npmjs.com/package/@cityssm/bulma-a11y)
[](https://app.codacy.com/gh/cityssm/bulma-a11y/dashboard)
[](https://ci.appveyor.com/project/dangowans/bulma-a11y)
[](https://app.snyk.io/org/cityssm/project/bf65d71f-8d8b-43ba-8262-29a3c92872ef)The [Bulma CSS framework](https://bulma.io/)
with increased colour contrast to meet accessibility requirements,
and some accessible enhancements too. 😊

## Installation
```sh
npm install @cityssm/bulma-a11y
```## Usage
Rather than linking to `bulma.min.css` in your webpage,
link to `bulma-a11y.min.css`.```html
```
## Test Pages
The following pages have minimal styling.
They use code samples from the official Bulma website to test for sufficient colour contrast.- [Buttons](https://cityssm.github.io/bulma-a11y/test/server/html/buttons.html)
- [Messages](https://cityssm.github.io/bulma-a11y/test/server/html/messages.html)
- [Notifications](https://cityssm.github.io/bulma-a11y/test/server/html/notifications.html)
- [Tags](https://cityssm.github.io/bulma-a11y/test/server/html/tags.html)
- [Skip Links](https://cityssm.github.io/bulma-a11y/test/server/html/skipLinks.html)## âš Important Note
While bulma-a11y attempts to improve colour contrast of the main Bulma components,
using bulma-a11y **does not guarantee** your website will be considered accessible.## Related Project
Need the JavaScript to make your Bulma dropdowns and tabs work
while keeping accessibility in mind?Check out [cityssm/bulma-js](https://github.com/cityssm/bulma-js).