Verified Badge

X-style verified badge with shimmer or static variants.

Installation

npx shadcn@latest add @iconiq/verified-badge

Inline X-style verified scallop with a check. Use shimmer or static variants.

variant"shimmer" | "static"

Default shimmer

Use `shimmer` for a sweeping highlight across the scallop or `static` for a fixed badge.

sizenumber

Default 64

Width and height in pixels for the outer badge; the check scales to half this value.

classNamestring

Merged onto the root span. Pass a `text-*` class to override the default Twitter-blue scallop color.

aria-labelstring

Default Verified

Announced to screen readers. Override when the badge conveys a different status.

Extends native `span` props (`id`, `onClick`, `data-*`, tooltips, and other `aria-*` attributes) via prop spreading on the root.

Default color lives on the root span (`text-[hsl(203,89%,57%)]`); scallop paths use `currentColor` so `cn` can override via `className`.

The `shimmer` variant uses Motion to sweep a highlight across the scallop (0.5s pass, 1.5s pause between repeats).

Root uses `role="img"` with `aria-label`; inner SVG shapes are `aria-hidden`.

Install path is `components/ui/verified-badge.tsx` with the `VerifiedBadge` export.

Install the exact registry entry shown on the right when you want the component file and its declared runtime dependencies together.

Dependencies: motion.