KQ-1817 · FLAMBE/PAN

Flambe Pan

A copper pan on a dark range, held by its handle: a drag follows the hand 1:1, up to tip the far lip toward the gas and sideways to slide it over the grate, and a release sets it back level on springs.glide with the throw's velocity. When the lip dips past the catch angle the spirit catches, a front of fire running across the sauce from the low lip, and additive tongues of flame flare up, leaning with the tilt and trailing the pan through the air while the room takes their light; a quick shake gusts them higher before they burn down to a few blue licks and go out. Enter or Space tosses the pan (a tip on springs.snap and back on glide) when it is out and shakes it while it burns.

KQ-1817 · FLAMBE/PAN

Coldbrook Supper Club · tableside

Crêpes in orange butter, flamed at your table

Tableside · Coldbrook

out · tip the pan to catch the spirit

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/flambe-pan

Props

height: number; default 0.7; How tall the flare stands, as a share of the room above the pan, 0.2 to 1.
gust: number; default 0.6; How much a quick shake feeds the flames, 0 to 1.
hue: number; default 52; The flame's OKLCH hue at fixed lightness: 52 brandy orange, 30 deep red, 80 gold, 140 copper green.
burnTime: number; default 3.2; Seconds the spirit burns before the last blue lick goes out, 1 to 8.
catchAngle: number; default 12; Degrees the far lip must dip before it catches, 6 to 24.
maxTilt: number; default 30; The furthest the pan tips before it rubber-bands, 16 to 40 degrees.
lean: number; default 0.6; How far the tongues lean with the tilt and trail the pan's motion, 0 to 1.
density: number; default 0.7; How full the flame is, 0.3 (a few tongues) to 1 (a dense sheet).
metal: "copper" | "steel" | "iron"; default "copper"; The pan's metal.
rangeColor: string; default a dark steel pigment; The cooktop's colour.
trigger: "inView" | "mount" | "manual"; default "inView"; When the pan tips itself once to show the flare (silently): first seen, at mount, or never.
sound: boolean; default false; Play the flare when the visitor catches the spirit or gusts it with a shake.
onFlameChange: (state: "out" | "flaring" | "licks") => void; default —; Fires when the flame catches, burns down to blue licks, or goes out.
label: string; default "Flambé pan"; The scene's accessible name.
paused: boolean; default false; Hold the flame still where it is; the pan can still be moved.
disabled: boolean; default false; No tipping, tossing or shaking.
seed: number; default 1; Seeds the flame's tongues.
dpr: number; default 2; Cap on the canvas's pixel ratio, at most 2.
children: ReactNode; default —; Overlay content drawn above the scene; it never takes the pointer.
className: string; default —; Classes for the root; give it a size (the demo uses aspect-[16/10]).

Prop	Type	Default	Description
height	number	0.7	How tall the flare stands, as a share of the room above the pan, 0.2 to 1.
gust	number	0.6	How much a quick shake feeds the flames, 0 to 1.
hue	number	52	The flame's OKLCH hue at fixed lightness: 52 brandy orange, 30 deep red, 80 gold, 140 copper green.
burnTime	number	3.2	Seconds the spirit burns before the last blue lick goes out, 1 to 8.
catchAngle	number	12	Degrees the far lip must dip before it catches, 6 to 24.
maxTilt	number	30	The furthest the pan tips before it rubber-bands, 16 to 40 degrees.
lean	number	0.6	How far the tongues lean with the tilt and trail the pan's motion, 0 to 1.
density	number	0.7	How full the flame is, 0.3 (a few tongues) to 1 (a dense sheet).
metal	"copper" \| "steel" \| "iron"	"copper"	The pan's metal.
rangeColor	string	a dark steel pigment	The cooktop's colour.
trigger	"inView" \| "mount" \| "manual"	"inView"	When the pan tips itself once to show the flare (silently): first seen, at mount, or never.
sound	boolean	false	Play the flare when the visitor catches the spirit or gusts it with a shake.
onFlameChange	(state: "out" \| "flaring" \| "licks") => void	—	Fires when the flame catches, burns down to blue licks, or goes out.
label	string	"Flambé pan"	The scene's accessible name.
paused	boolean	false	Hold the flame still where it is; the pan can still be moved.
disabled	boolean	false	No tipping, tossing or shaking.
seed	number	1	Seeds the flame's tongues.
dpr	number	2	Cap on the canvas's pixel ratio, at most 2.
children	ReactNode	—	Overlay content drawn above the scene; it never takes the pointer.
className	string	—	Classes for the root; give it a size (the demo uses aspect-[16/10]).