TypeScript Accessibility

Open-source TypeScript projects categorized as Accessibility

Top 23 TypeScript Accessibility Projects

  • headlessui

    Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.

  • Project mention: Exploring Catalyst, Tailwind's UI kit for React | dev.to | 2024-03-27

    Catalyst is a comprehensive, fully componentized UI kit for modern React projects, built on the next generation of Headless UI. With Catalyst, you can create a custom set of components to use and reuse in your projects.

  • darkreader

    Dark Reader Chrome and Firefox extension

  • Project mention: What to avoid building as an early stage startup | news.ycombinator.com | 2024-03-03
  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • primitives

    Radix Primitives is an open-source UI component library for building high-quality, accessible design systems and web apps. Maintained by @workos.

  • Project mention: Radix Primitives: an open-source UI component library | news.ycombinator.com | 2024-03-20
  • react-spectrum

    A collection of libraries and tools that help you build adaptive, accessible, and robust user experiences.

  • Project mention: Accessibility and Headless UI Libraries - Adobe, Radix, Tailwind, MUI | dev.to | 2023-09-24

    Adobe - React ARIA

  • reakit

    Toolkit for building accessible web apps with React

  • Project mention: ⚡Top GitHub Repositories for UI Components | dev.to | 2024-01-05

    🔍 Site ⭐ GitHub

  • noUiSlider

    noUiSlider is a lightweight, ARIA-accessible JavaScript range slider with multi-touch and keyboard support. It is fully GPU animated: no reflows, so it is fast; even on older devices. It also fits wonderfully in responsive designs and has no dependencies.

  • Project mention: Who knows the name of this plugin? | /r/Wordpress | 2023-06-08

    The individual sliders are built using this: https://refreshless.com/nouislider/

  • themes

    Radix Themes is an open-source component library optimized for fast development, easy maintenance, and accessibility. Maintained by @workos.

  • Project mention: ⚡Top GitHub Repositories for UI Components | dev.to | 2024-01-05

    🔍 Site ⭐ GitHub

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

    InfluxDB logo
  • zag

    Finite state machines for building accessible design systems and UI components.

  • Project mention: Top 5 Headless Components For Your React Application In 2023 | dev.to | 2023-10-14

    Zag.js and Ark are headless component libraries created by the teams behind Chakra UI.

  • date-picker

    Duet Date Picker is an open source version of Duet Design System’s accessible date picker. Try live example at https://duetds.github.io/date-picker/

  • player

    UI components and hooks for building video/audio players on the web. Robust, customizable, and accessible. Modern alternative to JW Player and Video.js. (by vidstack)

  • Project mention: How to Write a Great Readme | news.ycombinator.com | 2023-07-18

    vidstack is very light on technical details but starts with a concise intro and a screenshot, as well as relevant links: https://github.com/vidstack/player

    payload is well-structured in general: https://github.com/payloadcms/payload

    nanostores starts out with an intro and telling code examples, followed by lots of technical details: https://github.com/nanostores/nanostores

  • stylebot

    Change the appearance of the web instantly

  • Project mention: Dracula Theme for Hacker News | news.ycombinator.com | 2024-01-29

    You can also do this with the Stylebot extension - https://github.com/ankit/stylebot .. I was already doing this :) (just copy paste the CSS)

  • Spearmint

    Testing, simplified. || An inclusive, accessibility-first GUI for generating clean, semantic Javascript tests in only a few clicks of a button. (by open-source-labs)

  • accessibility-insights-web

    Accessibility Insights for Web

  • Project mention: Show HN: Accessibility Aid – Fixed Price WCAG and ADA Compliance | news.ycombinator.com | 2024-03-05

    Hi Roy,

    Thanks for sharing! I think it's great that more orgs/folks are trying to make the Web more accessible.

    I'm also a web dev with some experience, and I've done a few accessibility projects, both in-house and with third-party consultants.

    My main feedback is this: I would've loved to have been able to outsource to/partner up with experts for more of that work, but that would've been difficult at your prices. €2k-€4.5k/mo was between half and all of my salary as a full-time dev (working for small biz). On an ongoing basis, that would've been quite unaffordable.

    If you're truly interested in making "accessibility achievable and affordable for organizations of any size", might you consider a pricing model where it's X dollars for the initial work (where the bulk of it lies, in terms of initial design/audit/etc.), and then a lower Y dollars/mo for maintenance (reviewing some new content and pages, etc.)? Possibly also some sort of allowance/sliding scale for smaller sites or smaller orgs?

    In my experience, much of the work is frontloaded. Having to pay the same price month-to-month where subsequent months might not be much work at all is a tough sell. And in my experience, all-included subscription services like this often tend to be "best effort" anyway, especially for smaller customers who are competing for limited dev/design time with your bigger clients. At lower monthly costs, that's still a fair enough value proposition, but at four-figures a month... that's easily the territory where smaller companies might consider in-housing instead. And sure, people could subscribe for just a month or two and then cancel, but that feels disrespectful/dishonest.

    In the past accessibility projects we've done, the upfront audits cost a few grand on a mid-sized site. We were presented with various reports and tables (several tens of pages worth), but it was really just a checklist of things we'd go down and address. The actual fixes took about a week of dev time. Then on an ongoing basis, we just followed the same recommendations for our new content, occasionally using free tools like Microsoft's free Accessibility Insights (https://accessibilityinsights.io/) to double-check our pages for problems. These days a lot of it is built into IDEs too.

    That's not to say automated checklists are sufficient and can replace human expertise (yet), but they do take care of a lot of the low-hanging fruit, especially for ongoing content updates that follow the same format as previously audited pages/sites.

    Now, the above was just my personal experience primarily working for small biz and nonprofits. If you're primarily targeting bigger enterprises or early 2020s-style startups with infinite money, and purposefully trying to exclude smaller customers, that's totally valid and maybe that pricing makes sense? (It's probably cheaper to them vs hiring AAA labor in-house). But for smaller orgs, your prices are often more than their entire website budget and nearly as much as an additional staff person. If you truly want to target them as well, would you consider something that's more suitable for their budgets?

    ---

    Altogether separate than the pricing thoughts: It would also be lovely to see some demo reports/audits, or before/after screenshots etc. This is the sort of endeavor where the quality of consulting/auditing can vary a lot between service providers, and being able to see examples of your previous work would mean a lot.

    ---

    Thanks again for sharing, and I hope this feedback wasn't too harsh! Just my 2¢ as someone who wishes more companies would voluntarily take this work on.

  • react-accessible-accordion

    Accessible Accordion component for React

  • react-modal-sheet

    Flexible bottom sheet component built with Framer Motion to provide buttery smooth UX while keeping accessibility in mind 🪐

  • terracotta

    Headless UI for SolidJS

  • Midnight-Lizard

    Сustom color schemes for all websites

  • react-three-a11y

    ♿️ Accessibility tools for React Three Fiber

  • Project mention: how do you design scrolling "through" a website? | /r/webdev | 2023-04-20

    There is an accessibility library from drei: https://github.com/pmndrs/react-three-a11y

  • lighthouse-check-action

    GitHub Action for running @GoogleChromeLabs Lighthouse audits with all the bells and whistles 🔔 Multiple audits, Slack notifications, and more!

  • plyr-react

    A simple, accessible and customisable react media player for Video, Audio, YouTube and Vimeo

  • ej2-javascript-ui-controls

    Syncfusion JavaScript UI controls library offer more than 50+ cross-browser, responsive, and lightweight HTML5 UI controls for building modern web applications.

  • guidepup

    Screen reader driver for test automation.

  • Project mention: Screen reader driver for test automation (VoiceOver & NVDA) | /r/npm | 2023-05-21
  • grail-ui

    A library of accessible component primitives, actions and utilities for Svelte.

  • Project mention: We need more headless ui library, and I just spotted a good one | /r/sveltejs | 2023-07-11
  • WorkOS

    The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.

    WorkOS logo
NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2024-03-27.

TypeScript Accessibility related posts

Index

What are some of the best open-source Accessibility projects in TypeScript? This list will help you:

Project Stars
1 headlessui 24,105
2 darkreader 18,656
3 primitives 14,106
4 react-spectrum 11,573
5 reakit 7,622
6 noUiSlider 5,599
7 themes 4,011
8 zag 3,633
9 date-picker 1,703
10 player 1,667
11 stylebot 1,339
12 Spearmint 1,283
13 accessibility-insights-web 810
14 react-accessible-accordion 780
15 react-modal-sheet 727
16 terracotta 642
17 Midnight-Lizard 615
18 react-three-a11y 512
19 lighthouse-check-action 457
20 plyr-react 454
21 ej2-javascript-ui-controls 387
22 guidepup 380
23 grail-ui 374
The modern identity platform for B2B SaaS
The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.
workos.com