SeverityBadge
The level of a finding or an incident, from critical to info. Pick it whenever items are ranked by how much they matter.
- SeverityBadge
PreviewLink to the section Preview
Live in all three themes. Everything here is interactive.
Light theme, SeverityBadge
CriticalHighMediumLowInfo
Dark theme, SeverityBadge
CriticalHighMediumLowInfo
High contrast theme, SeverityBadge
CriticalHighMediumLowInfo
UsageLink to the section Usage
import { SeverityBadge } from '@skribly/ui/feedback'<SeverityBadge severity="high">{t('severity.high')}</SeverityBadge>Every label is a prop, so the app passes its own words in its own language. See no built-in text.
AccessibilityLink to the section Accessibility
- The level is the visible word, which comes from the app.
- Chevrons climb with the level, so the order reads without colour; the glyph is hidden from screen readers.
This demo runs through axe in all three themes on every test run. See what the tests check.