Highly customizable checkboxes and radio buttons (jQuery Zepto)
jquery-plugin checkbox radio input field form desktop mobile custom replacement accessibility skins ui checked disabled indeterminate css3 html5 tiny lightweight jquery zeptoIf you use Bootstrap library (version 3.x) on your website, your pages will now be much more usable and navigable for and by keyboard and screen reader users with no work on your part. Believe us, for this they will thank you! Read on to learn about all the enhancements introduced by this plugin.Feel free to play with the live demo of the components listed above and the Bootstrap Accessibility Plugin in action. Seeing how "accessified" widgets work in this demo will help you verify whether the plugin is installed correctly on your website.
bootstrap accessibilityYou need an autocomplete/dropdown/select experience in your application and you want it to be accessible. You also want it to be simple and flexible to account for your use cases.This is a component that controls user interactions and state for you so you can create autocomplete/dropdown/select/etc. components. It uses a render function as children which gives you maximum flexibility with a minimal API because you are responsible for the rendering of everything and you simply apply props to what you're rendering.
react autocomplete combobox autoselect enhanced-input autosuggest typeahead dropdown select omnibox accessibility wai-aria multiselect multiple-selectionA lightweight HTML5 video player which includes support for captions and screen reader accessibility. For details, read the blog post Introducing an Accessible HTML5 Video Player on the PayPal Engineering blog. Also see 7 Lessons from Developing an Accessible HTML 5 Video Player.Insert the CSS in the Head of your HTML document. You'll also need to upload the sprite image (or use your own) and adjust the path in the CSS file.
html5-video-player video paypal accessibility html5 accessible playerWarns about potential accessibility issues with your React elements.In your main application file, require the module and call it, you'll start getting warnings in the console as your app renders. Note that by default all rules are turned off s oyou need to turn them on first (by setting them to "warn" or "error").
accessibility react a11yally.js is a JavaScript library simplifying certain accessibility features, functions and behaviors. Its goal is to be A JavaScript library to help web applications with accessibility concerns. The intention is to separate these generic components from actual applications and other libraries.ally.js is published under the MIT License.
accessibility a11y focus keyboard keyboard-navigation focusable tabbing tabbablePhantomJS, which is used for generating the screenshots, is installed automagically, but in some rare cases it might fail to and you'll get an Error: spawn EACCES error. Download PhantomJS manually and reinstall a11y if that happens.
cli-app cli a11y audit test accessibility wai aria dev developer tool report web websiteA jQuery on-screen keyboard (OSK) plugin that works in the browser. Originally posted by Jeremy Satterfield in his blog, jQuery plugins and on Snipplr. Currently maintained by Mottie. You can use it with TypeScript. Install TypeScript and @types/virtual-keyboard into dev dependencies for that.
keyboard osk virtual-keyboard customizable ui accessibility jquery-pluginhint.css is written as a pure CSS resource using which you can create cool accessible tooltips for your web app. It does not rely on JavaScript but rather uses aria-label/data- attribute*, pseudo elements, content property and CSS3 transitions to create the tooltips. Also it uses BEM naming convention particularly for the modifiers.
tooltip-library purecss accessibility simple-api tooltip bem css ui sass help hintThis is a library of accessibility-related testing and utility code. Its main component is the accessibility audit: a collection of audit rules checking for common accessibility problems, and an API for running these rules in an HTML page.
accessibility testing wcagTake a set color palette and get contrast values for every possible combination – useful for finding safe color combinations with predefined colors and includes pass/fail scores for the WCAG accessibility guidelines. Pass an array of color strings or an object with color strings as values.
color contrast wcag accessibilityPronounced Alix. Because it’s simpler. The whole presentation lives in the wiki. Please note that a substantial work has been accomplished to document the whole project, from the Sass layer to each test explanations through CSS selectors and tricks. I suggest you make a tour on a11y.css documentation website.
css accessibility diagnostics sass test documentation wiki selectors markup html bookmarklet a11y accessibility-checker testing scssThe aim of this library is to make modal dialogs accessible and easy to include in your project with minimum configuration. It's only ~1.8kb minified and gzipped - A tiny library for big change.
modal modal-dialogs accessibility a11y accesibleNice, sleek and intuitive. A grid control especially designed for bootstrap.jQuery Bootgrid is a UI component written for jQuery and Bootstrap (Bootstrap isn't necessarily required). It supports Responsive web design, Server-side data loading (async), Dynamic Manipulation via API, Column converters & formatters, Client-side data loading (in-memory), Single & multiple row selection support.
jquery-plugin bootstrap plugin component control ui grid table data sorting filtering html5 accessibility jqueryThis extension inverts brightness of web pages and aims to reduce eyestrain while browsing the web. Visit Chrome Web Store and Firefox Add-ons for more info. Donate via Open Collective.
dark-theme chrome-extension firefox-addon dark-mode night-mode darkmode nightmode accessibility eye-careOther frameworks are too design opinionated and heavy. They're great for prototyping but every time you start a real, front-facing, project with them you have to overwrite lots of designer styles that do nothing to add to the functionality of the website. That costs developers time and money. Responsive BP has been built with that in mind. It is the result of thousands of hours of real, client driven web development and testing; specifically developed to be as lightweight as possible to prevent the need to undo styles set by the framework itself and allow developers to write efficient code and lower costs.
sass css rwd accessibility html5 responsive-gridAxe is an accessibility testing engine for websites and other HTML-based user interfaces. It's fast, secure, lightweight, and was built to seamlessly integrate with any existing test environment so you can automate accessibility testing alongside your regular functional testing. Sign up for axe news to get the latest on axe features, future releases, and events.
accessibility a11y testing unit tdd bdd axeStatic AST checker for accessibility rules on JSX elements. Ryan Florence built out this awesome runtime-analysis tool called react-a11y. It is super useful. However, since you're probably already using linting in your project, this plugin comes for free and closer to the actual development process. Pairing this plugin with an editor lint plugin, you can bake accessibility standards into your application in real-time.
eslint aria a11y accessibility jsx react eslintplugin eslint-pluginWe provide 12 additional color picker components for different color models, unless your app needs a HEX string as an input/output format. The easiest way to tweak react-colorful is to create another stylesheet to override the default styles.
react hooks hex color preact color-picker react-component a11y tiny picker zero-dependency typescript-support colorpicker front-end accessible react-color accessibility aria wai-ariaWith more than 85 components, over 45 available plugins, several directives, and 1000+ icons, BootstrapVue provides one of the most comprehensive implementations of the Bootstrap v4.5 component and grid system available for Vue.js v2.6, complete with extensive and automated WAI-ARIA accessibility markup. Support this project by becoming a sponsor.
bootstrap components vue accessibility icons a11y nuxt accessible wai-aria component-library nuxtjs bootstrapvue bootstrap-v4 bootstrap-for-vue vue.js vue-v2 ssr web directives bootstrap-icons aria popper.js css scss alert avatar badge breadcrumb button calendar card carousel checkbox collapse date-picker datepicker dropdown dropzone form input jumbotron list modal nav navbar option overlay pagination popover progress radio select sidebar skeleton slider spinner tab table tag tags time-picker timepicker toast tooltip
We have large collection of open source products. Follow the tags from
Tag Cloud >>
Open source products are scattered around the web. Please provide information
about the open source projects you own / you use.
Add Projects.