Components

Headless and accessible. Pass data directly (shown here) or let them fetch via a <PredictionKitProvider>.

ProbabilityBadge

Renders a 0–1 probability as a percentage. Pure — no provider needed.

<ProbabilityBadge probability={0.72} />

MarketCard

Title, probability, source, and status. Pass a market object or a marketId to fetch.

<MarketCard market={market} />

MarketList

Renders many markets. Pass an array or fetch options.

<MarketList markets={markets} />

TrendingMarkets

Fetches trending markets across all providers (requires a provider). See it running on the live demo.

<TrendingMarkets limit={10} />

ProbabilityChart

From @prediction-kit/charts — an area chart of a market’s probability over time (Recharts). Pass data or a marketId + interval to fetch. See a live one on the demo.

<ProbabilityChart marketId="kalshi:KXPRESPERSON-28-GNEWS" interval="1m" />