React Smith Chart

Every RF engineer reads one; almost no component library draws one. Complex impedances are normalised to the reference Z₀ and mapped onto the reflection-coefficient disc, with the constant-resistance and constant-reactance arcs that make it a Smith chart — plus |Γ|, VSWR, and a matched-centre marker.

Antenna matching — 2.45 GHz

Reference Z₀ = 50 Ω

PointZ (Ω)|Γ|VSWR
Antenna load73.0 + j42.50.3712.18
After L-match50.0 + j3.10.0311.06
Stub tuner28.0 − j35.00.4842.87

Installation

npx shadcn@latest add "https://kelvinui.com/registry/smith-chart.json"

Props

PropTypeDescription
z0numberReference impedance in ohms (default 50)
pointsSmithPoint[]{ id, label?, resistance, reactance, color? }
showVswrbooleanDraw the constant-VSWR circle through the first point
titlestringHeading
sizenumberSVG size in px (default 340)

The mapping

Each impedance z = R + jX is normalised (z/Z₀) and converted to its reflection coefficient by the bilinear transform Γ = (z − 1) / (z + 1), computed in complex arithmetic. The result lands inside the unit disc for any passive load; the real axis runs horizontally and positive reactance is the upper half.

The grid is drawn analytically, not sampled: constant-resistance loci are circles centred at (r/(r+1), 0) with radius 1/(r+1), and constant-reactance loci are arcs of circles centred at (1, 1/x) with radius 1/x, clipped to the disc. The dashed VSWR circle is a circle of radius |Γ| about the centre — every impedance on it has the same standing-wave ratio, which is exactly the locus a matching network moves you along.

The readout gives VSWR as (1 + |Γ|) / (1 − |Γ|); a perfectly matched load sits at the centre with |Γ| = 0 and VSWR = 1. Feed it live measurements from a VNA sweep and it becomes a tuning aid rather than a diagram.

New components every week

Get the week's new Kelvin UI components and templates in one short email. No spam, unsubscribe anytime.