"The accessible HTML standard"

KoliBri stands for "component library for accessibility" and was released as open source by the Informationstechnikzentrum Bund (ITZBund) for reuse and continued development.

Together we make HTML accessible using reusable web components to ensure usability and accessibility.

The HTML web standard is itself very “openly” specified in order to be as long-lasting and robust as possible. It therefore often happens that HTML compositions are not easily accessible, semantic and valid.

KoliBri is based directly on the Web standards of the W3C (framework-agnostic), and is generic Reference implementation of the WCAG standard and the BITV for accessibility and implemented as a multi-theming capable presentation layer. There is no technical reference and no data transfer functionality. This means that KoliBri is equally reusable for the realization of static websites as well as dynamic web applications with different corporate designs and style guides and is therefore very interesting for open source.

KoliBri is always actively working on improvements, new features and future-oriented innovations for the latest major release. In parallel, a selected LTS release is maintained with regard to bug fixes.

gantt
    title LTS & STS
    dateFormat YYYY-MM-DD

    1.x (LTS) :, 2021-12-01, 3y
    2.x (LTS) :,  2023-12-01, 3y
    3.x (STS) :crit , 2024-12-01, 1y
    4.x (LTS) :, 2025-12-01, 3y
    5.x (STS) :crit , 2026-12-01, 1y

Install the packages with pnpm:

pnpm install

Run the build once to generate the components:

pnpm -r build

Install the default theme and register the components:

pnpm add @public-ui/components @public-ui/theme-default

import { register } from '@public-ui/components';
import { defineCustomElements } from '@public-ui/components/dist/loader';
import { DEFAULT } from '@public-ui/theme-default';

register(DEFAULT, defineCustomElements);

The focus of KoliBri is on small (atomic), very flexible and highly reusable HTML compositions (e.g. buttons). We offer an accessible, semantic and valid standard implementation of such components that can be reused for any higher-level HTML structure or component (molecule, organism or template). These atomic components are where we should collaborate and cooperate to combine our skills and knowledge. The synergy effects on the basic components allow you to focus more on subject-specific content.

Let's make KoliBri better and more colorful together!

Continue to Documentation…

Bug reports and pull requests are welcome. Please read our contribution guide before getting started.

• Get Started
• Contributing
• Code of Conduct
• Known Issues
• Security