Internet Explorer is not supported by Design Library

The last version of Internet Explorer, version 11, was released on October 17, 2013. This is a very long time ago when taking into account the rapid development of web technologies. These days it is often difficult and time consuming to get modern technologies to work well in this old browser. More and more frameworks are dropping support, and even Microsoft themselves has announced that they will fully drop support for IE in their own services in 2021.

Consequently, we have decided to not include support for IE in the Design Library website.

Luckily, there are modern options in active development. Please use Firefox, Edge or Chrome instead.

seb logo

Badge

This component calls attention to a status/tag/category and highlights it from the surrounding content.

Badge

Available in

Component meta

Component identifier

component-badge

Design version

2023-01-04

Design principles

Trigger insight

Guidelines

Short description

To display a status in an intuitive and easy way

When and how to use it

Use this component to display a status in a more prominent way then just typing out the status. Use the respective colour for alert messages.

Badge component example

Behaviour

The behaviour is static.

Do's and don'ts

Do
Don't
  • Avoid over-using them

 

Writing

-

 

Accessibility

Result from the latest accessibility review of the component (Chlorophyll+Angular+React): 2023-07-24

  • Contrast: ok
  • Colour-blindness: good
  • Code + aria: ok
  • Touch + keyboard: good
  • Dark-mode: n/a
  • Focus: ok - need new style
  • Reader: ok

 

Specification

 

Related patterns & components

Component
Alert ribbons

Page last updated

Feedback

Was this helpful?