Skip to main content


Learn here why KoliBri is so helpful.

KoliBri stands for "Component library for the accessibility"


Together, we make HTML semantically accessible using reusable Web Components to ensure usability and accessibility.



HTML web standard

is specified to be very "open" in order to be as durable and robust as possible. It therefore often happens that HTML compositions are not readily accessible, semantic and valid. KoliBri builds directly on the


web standards

(framework-agnostic), is thereby a generic reference implementation of the

WCAG standard



for accessibility, and is implemented as a multi-theme-enabled presentation layer. There is no technical reference and no data transfer functionalities. This makes KoliBri equally reusable for the realization of static websites as well as dynamic web applications of different corporate designs and style guides and thus very interesting for open source.

Collaboration and cooperation

The focus of KoliBri is on small (atomic), very flexible and well reusable HTML compositions (e.g. button). We provide 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).

We should collaborate and cooperate on these atomic components in order to bundle our skills and knowledge. Through the synergy effects at the basic components, our own focus can be placed more on subject-specific content.

Let us make KoliBri better and more colorful together!


KoliBri is released under the EUROPEAN UNION PUBLIC LICENCE v1.2 open source. The following aspects are in particular thereby considered:

  • Making accessible: The artifacts and source code can be reused freely and without charge by anyone. In this way, the ITZBund makes a contribution in the sense of

    “Public Money – Public Code”


  • Warranty and liability disclaimer: No warranty or liability claims are associated with the reuse.

  • “Copyleft” clause: Copyleft states that any copy of KoliBri (fork) must be re-released under the same or a compatible open-source license.


To use KoliBri correctly, it is important to know where it unleashes its potential. KoliBri is reusable in many ways because the styling has been completely decoupled and rendering is possible client-side but also server-side.


KoliBri is neither a CSS framework nor a design system, but a library of frequently used components that have accessibility and usability requirements. To avoid having to look at these requirements over and over again, KoliBri uses Web Components to create an overarching uniform standard for all style guides here.

The more relevant components are found and implemented, the more value is added to all web-based projects. However, KoliBri does not aim to implement components without accessibility and usability requirements. Standard HTML and CSS or alternative CSS frameworks can be used for this purpose.

KoliBri components can be seamlessly integrated into existing websites or web applications and provide their style (guide) themselves, encapsulating it almost completely from the outside.


Web components can be rendered on the client side (CSR), prerendered (SSG), or on the server side (SSR). The rendering depends on the respective technical framework conditions (



💡 It should be noted that Web Components is a JavaScript-based web standard. Server-side rendering allows the Web Component to be rendered for optimal display speed on the client. If client-side JavaScript is allowed, the full dynamics of the Web Component are also available client-side. However, if you want to avoid using JavaScript on the client side, the Web Component is rendered, but the dynamics are lost.

🧪 Server-side rendering of Web Components is an exciting new functionality where adjustments to the prerenderer will still be necessary and is therefore classified as experimental on our part (



KoliBri follows the principles of semantic versioning.

Structure of a version:

  • It usually consists of 3 parts (e.g. 1.0.2)

    • Major, here the 1

    • Minor, here the 0

    • Patch, here the 2

  • For the release phase of a version, you can use additional labels (e.g. 1.0.3-rc.2)

    • Label, here the rc.2

The following main principles are applied:

  • Patch: Includes changes that improve the current functionality and do not change its use.

  • Minor: Includes changes that extend the functional scope and do not change the existing functional scope in its use.

  • Major: Includes changes that enable architectural realignment and are allowed to change the use of the existing feature set.

You can find the complete description of the SemVer here:

Quality objectives

The following table lists the prioritized qualities of KoliBri:

Device, operating system, browser and screen reader requirements

KoliBri is intended for the implementation of any web-based user interfaces and should be able to be used on all modern devices (PC, tablet, mobile), operating systems (Windows, Linux, macOS, Android, iOS) and standards-compliant browsers.

Microsoft Internet Explorer is explicitly not supported in order not to weaken the project and the development by legacy. Instead, KoliBri consistently invests in the future.