Skip to main content

Introduction

ravixUI is an accessibility-focused component starter kit for Astrojs made with Tailwind, which gives you all the code directly out of the box including the JavaScript implementation.

Why is the code directly available?

ravixUI embraces the belief that accessibility is contextual. By providing the source code directly, we empower you to tailor the components to your unique use cases. Semantic HTML is our preferred implementation approach whenever feasible. However, when certain functionalities cannot be achieved with semantic elements alone, our components adhere to the WAI-ARIA design patterns, ensuring WCAG 2.1 AA level conformance. In scenarios where no WAI-ARIA Authoring Practices and Guidance patterns exist, we judiciously employ ARIA attributes and roles, ensuring a logical and accessible experience for the specific component.

The idea is to set you up with a starting point for building your own accessible website and components.

Prerequisites

Limitations

Currently the component starter kit is in the early stages of development and there are a few caveats to be aware of :

  • Code may require testing and customization to fit your specific use case.
  • The Forms components is still in a development stage and is not recommended for any usage.
  • The component starter kit does not provide unit tests and hence it is recommended to use only after thorough testing if the particular component depends on JavaScript.
  • The testing with astro container API and Vitest is currently in early stages.

There are a few more things which are noteworthy :

  • It is built using the cloudflare integration (Shouldn’t be a issue for most environments. All the pages are static in nature and should translate well regardless of the environment).
  • It is tested on Chrome, Firefox, Brave and Edge.(Not tested on Safari yet. Planned for the future)
  • It is made with astroJS in mind and uses astroJS for the build process, so it may not work with other frameworks or static site generators.

Disclaimer

While all efforts have been made to ensure that the components are accessible out of the box, there may be cases where it may not be accessible when you use it in your project. In case you encounter any such cases, please raise an issue on the GitHub repository .

Next Accessibility