PriorityIcon
How much a task matters — three rising bars, three dashes, or an urgent badge.
A 16px glyph for task priority. low, medium and high draw three rising bars with one, two or all three solid (the unfilled ones at 40% opacity); none draws three dashes; urgent draws a filled badge with an exclamation mark. It is decorative (aria-hidden), so whatever shows it should name the priority in text, and it takes its colour from currentColor via soft-text tokens so it keeps contrast in both themes. The urgent badge uses the fgDangerSoft token (red) — a token choice, not a value measured from Linear.
Pair it with StatusIcon in a task row.
Installation
npm install @crisp-ui-kit/crispUsage
import { PriorityIcon } from "@crisp-ui-kit/crisp";
<PriorityIcon priority="high" />
<PriorityIcon priority="urgent" size={20} />Props
PriorityIcon also accepts every SVG attribute except children.
Prop
Type
priority is a TaskPriorityValue: "none" | "urgent" | "high" | "medium" | "low".