KQ-1853 · GEODESIC/SPIN

Geodesic Spin

A wireframe geodesic sphere you spin by hand: it turns 1:1 under a drag, coasts on the release velocity for as long as its inertia allows and eases back to a slow turntable spin, its near struts lit from a light high on the left and its front hubs catching a glint that slides from hub to hub. Past a speed every strut splits at its middle, the new hubs pushed out from the old chords to the sphere on the snap spring's one overshoot while the new struts draw out from their centres, and as it coasts down the frame merges back on glide. The arrow keys spin it (Shift for more), so repeated presses split it as a flick does, and Home brakes it.

KQ-1853 · GEODESIC/SPIN

Fernworks · Garden domes

Six-metre dome kit

2V frame

Faces: 80
Struts: 120
Hubs: 42

2V · 80 faces · drag to spin

Open it on the Canvas stage

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/geodesic-spin

Props

frequency: number; default 2; Geodesic frequency at rest, 1 to 4: a 2V frame has 80 faces, a 4V frame 320.
maxFrequency: number; default 8; The finest frame a fast spin reaches, 2 to 8; levels double from the base frequency.
splitAt: number; default 3.2; Spin speed in rad/s that splits the first level; each further level needs 1.8 times more, and a level merges back below 0.65 of its threshold.
inertia: number; default 0.6; How long a flick coasts, 0 (it stops almost at once) to 1 (it coasts for seconds).
strut: number; default 1.2; Strut weight in px, 0.5 to 2.5.
idleSpin: number; default 0.2; The turntable spin it returns to when left alone, rad/s; 0 lets it come to rest and stop drawing.
tilt: number; default 16; How far the rest pose leans toward you, degrees.
glint: number; default 0.7; Strength of the specular glints on the near hubs, 0 to 1.
perspective: number; default 0.35; How much nearer struts are drawn larger, 0 (orthographic) to 1.
color: string; default "var(--ink-2)"; Strut colour, any CSS colour.
lightColor: string; default "var(--accent-bright)"; The colour lit struts and glints turn toward.
readout: boolean; default true; Show the frequency and face count in the corner.
onFrequencyChange: (frequency: number, faces: number) => void; default —; Fires when a split or merge completes, and once at mount, with the frequency and face count.
paused: boolean; default false; Hold the frame still; a drag still turns it.
disabled: boolean; default false; No drag and no keys.
label: string; default "Geodesic frame"; Accessible name.
dpr: number; default 2; Cap on the canvas's device pixel ratio, at most 2.
className: string; default "h-52 w-full"; Sizes the box; the sphere fits its shorter side.

Prop	Type	Default	Description
frequency	number	2	Geodesic frequency at rest, 1 to 4: a 2V frame has 80 faces, a 4V frame 320.
maxFrequency	number	8	The finest frame a fast spin reaches, 2 to 8; levels double from the base frequency.
splitAt	number	3.2	Spin speed in rad/s that splits the first level; each further level needs 1.8 times more, and a level merges back below 0.65 of its threshold.
inertia	number	0.6	How long a flick coasts, 0 (it stops almost at once) to 1 (it coasts for seconds).
strut	number	1.2	Strut weight in px, 0.5 to 2.5.
idleSpin	number	0.2	The turntable spin it returns to when left alone, rad/s; 0 lets it come to rest and stop drawing.
tilt	number	16	How far the rest pose leans toward you, degrees.
glint	number	0.7	Strength of the specular glints on the near hubs, 0 to 1.
perspective	number	0.35	How much nearer struts are drawn larger, 0 (orthographic) to 1.
color	string	"var(--ink-2)"	Strut colour, any CSS colour.
lightColor	string	"var(--accent-bright)"	The colour lit struts and glints turn toward.
readout	boolean	true	Show the frequency and face count in the corner.
onFrequencyChange	(frequency: number, faces: number) => void	—	Fires when a split or merge completes, and once at mount, with the frequency and face count.
paused	boolean	false	Hold the frame still; a drag still turns it.
disabled	boolean	false	No drag and no keys.
label	string	"Geodesic frame"	Accessible name.
dpr	number	2	Cap on the canvas's device pixel ratio, at most 2.
className	string	"h-52 w-full"	Sizes the box; the sphere fits its shorter side.