Icons

Included icons (pure css)

Navigation

This section showcases various icons that are included in our design system. The icons are categorized into different groups based on their usage. Below, you will find examples of navigation icons and action icons, all implemented using pure CSS.

Additionally, we demonstrate the different sizes available for these icons, ranging from small (s) to 5 extra-large (5xl). This ensures that the icons can be used in a variety of contexts and maintain visual consistency across the application.

Actions

This section showcases various icons that are included in our design system. The icons are categorized into different groups based on their usage. Below, you will find examples of navigation icons and action icons, all implemented using pure CSS.

Additionally, we demonstrate the different sizes available for these icons, ranging from small (s) to 5 extra-large (5xl). This ensures that the icons can be used in a variety of contexts and maintain visual consistency across the application.

Icon sizing (s to 5xl)

This section showcases the different sizes available for icons in our design system. The icons are categorized into different groups based on their usage. Below, you will find examples of navigation icons and action icons, all implemented using pure CSS.

Additionally, we demonstrate the different sizes available for these icons, ranging from small (s) to 5 extra-large (5xl). This ensures that the icons can be used in a variety of contexts and maintain visual consistency across the application.

Sizing with external icons (svg)

Icon integration

Buttons

This section showcases the integration of icons within buttons. We provide examples of buttons with inline icons, as well as buttons that use SVG icons. These examples demonstrate how icons can be seamlessly integrated into button elements to enhance usability and visual appeal.

Badges

This section showcases the integration of icons within badges. We provide examples of badges with inline icons, as well as badges that use SVG icons. These examples demonstrate how icons can be seamlessly integrated into badge elements to enhance usability and visual appeal.

filter warning