Designed for developers – faster start, simple, flexible, no lock-in

A11yes was designed from the ground up to integrate seamlessly with any modern web architecture.


Whether it’s a classic HTML project, a single-page application, or a framework-based app.
Integration takes just a few minutes and doesn’t require deep changes to your existing code.

You keep full control: you decide how A11yes is integrated into your system landscape.
Integration can be done manually or directly in the build process and fits cleanly into existing workflows.

The result: a stable, high-performance, and future-proof integration—without extra technical bloat and without dependence on an external platform.

Integration takes only a few minutes

Installation

Ideal for static websites or projects without a build pipeline.

  • Download the latest version.
  • Include the CSS and JavaScript in your project.
  • Initialize A11yes in your own code if you want to use a custom configuration.

This way, you retain full control over hosting and the loading order of the assets.

<!-- Include A11yes CSS -->
<link rel="stylesheet" href="/your-path/libs/a11yes/a11yes.css" />

<!-- Include A11yes JavaScript -->
<script type="module" src="/your-path/libs/a11yes/a11yes.js"></script>

<!-- Include your custom JS to Custom Configuration A11yes (Optional)-->
<script type="module" src="/your-path/index.js"></script>

Configuration tailored to your needs

A11yes is fully configurable and adapts to your project — not the other way around.

You can pass configuration options to the a11YesInit object
to individually control behavior, appearance, and feature set.

Whether it’s a streamlined UI, specific accessibility features, or project-specific defaults — everything can be defined centrally.

a11YesInit({
    currentLanguage: 'de',
    openButtonClassname: 'a11yes-open',

    // Font size controls
    fontSize: true,
    fontSizeStep: 2,
    fontSizeMax: 5,
    fontSizeMin: 0,

    // Letter spacing controls
    letterSpacing: true,
    letterSpacingStep: 1,
    maxLetterSpacingSteps: 5,
    minLetterSpacingSteps: 0,

    // Contrast settings
    contrast: true,
    highLightColor: 'red',

    // Fonts options
    fonts: {
        'Arial': 'Arial, sans-serif',
        'Times New Roman': 'Times New Roman, serif',
    },

    // Enable other accessibility functions
    otherFunctions: true,

    // Links shown in the popup (array of [label, URL, target])
    links: [
        ['Learn more about Accessibility', 'https://www.a11yes.com/', '_blank'],
        ['Simple Language', 'https://www.a11yes.com/', '_blank']
    ],

    // Show icons in the popup
    icons: true,

    // Path to your translations file
    translations: "./path-to-your-translations.json"
});

The configuration can be adjusted at any time without breaking existing integrations.

Built for Performance & Scalability

  • No dependency on external services
  • Minimal bundle size
  • Framework-agnostic
  • No impact on Core Web Vitals

A11yes tool integrates seamlessly into your application while meeting the highest accessibility standards.

[Translate to English:] Download
Download the A11yes tool and get started! Downloads