Live samples

Composable primitives

Frames, panels, HUD, radar, and terminal — static first, islands only where noted. Configure the shell on Settings.

Command panel

Live preview
Signal

98.4%

Latency

12ms

Nodes

06

Buttons use audio cues by default; disable with sound={false}.

Glass stack

Layered depth with frost, inner highlight, and token-driven borders — no global state.

Inner glow wrapper

Compose Glow around any slot content.

React island

Angled Frame stays visible: wrap square islands with sf-frame-content-inset so opaque children do not cover the chamfered SVG border. Framer Motion drives the conic border; the interior stays static HTML from Astro.

Typography

Heading

Orbitron display

Label Uppercase microcopy
Data

00:14:22:09

Frames only

Primary frame + glow
Secondary frame + shimmer
Tactical kit

HUD · radar · terminals

Compose cockpit layers with HudMount, bracket corners, reticle, and status strips — then drop a passive Radar or log output in a framed Terminal. All static except your existing islands.

HUD compose

Pitch
+02.4°
Yaw
184.0°
Shortcut: HudFrame bundles mount + corners + optional reticle for full-screen overlays.
HudFrame preview
Empty slot — add alerts, maps, video…

Secondary radar

Pass the blips prop, or add children with slot="blips" for custom SVG markers.
listening on 0.0.0.0:4409 …
astro telemetry push --live
bundle graph optimized · 12 modules
hint: charts + Open-Meteo live on /dashboard
warn: solar flux minor — recalibrate in 240s
ok.