KQ-375 · FLAME/BORDER

Flame Border

A ring of fire around an element, following its rounded corners. Flames lick inward from every edge with a warm glow on the interior; the middle of the page stays untouched. The border reads the host's corner radius, so it fits whatever shape it wraps.

KQ-375 · FLAME/BORDER

Gaugeworks · hot path

Rack 6 is running at its edge.

Three readings, all trending the same direction at once. Nothing has tripped yet, and the margin below is the only number here still moving in your favour.

Temperature

94.2°C94.2°C

Load

88%88%

Margin

6%6%
06:41 uptime

wrapped in fire

Install

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

$ pnpm dlx shadcn@latest add @kinetiq/flame-border

Props

PropTypeDefaultDescription
width / intensity / speednumberHow far the flames reach inward in px, how fierce, and how fast.
color / glowstring · numberThe fire's base colour and the warmth cast onto the interior.
cornernumberCorner radius override in px; by default the host's computed radius.