Components
Pill
Circular count indicator for unread counts and totals.
62414499+
Usage
import { Pill } from "@sophic/portal-ui/components/ui/pill";<Pill>6</Pill>Props
Pill is a plain passthrough: it accepts every native <span> attribute and
has no props of its own. Wider content (e.g. 99+) stretches the circle
into a capsule.
Changelog
- 15 September 2026 — Two- and three-digit counts grow into a capsule. Single digits stay circular.
- 20 August 2026 — Chrome in a CSS module; look unchanged. Full notes
- 14 July 2026 — Added (circular counter; capsule for wider values). Full notes