KQ-1825 · TILLED/HORIZON

Tilled Horizon

A two-tone print of a ploughed field at dusk: furrows run away from you as fine wavy ribbons over rolling hills toward a low sun striped by haze, each drawn near to far so a crest hides the furrow behind it, heavy where the slope turns from the sun and hairline where it faces it, with the furrows in line with the sun taking its ink. The field glides slowly toward you. The pointer, or keyboard focus moving onto a control laid over it, slides the sun along the horizon on the springs.drift constants and the light rolls across every hill with it.

KQ-1825 · TILLED/HORIZON

Fieldline Farms · open days

Autumn ploughing, every Saturday

Book a ride

sun 62% along · dusk print

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/tilled-horizon

Props

children: React.ReactNode; default —; Content laid over the field in its own layer; it keeps every click and focus.
spacing: number; default 11; The furrows' spacing at the near edge, px: small is a fine engraving, large a few broad ribbons.
roll: number; default 0.5; How much the land rolls, 0 a flat field to 1 steep hills that hide the furrows behind them.
palette: "dusk" | "harvest" | "indigo" | "moss"; default "dusk"; The two inks the print is pulled in; the paper follows the page.
inkColor: string; default —; Overrides the land's ink, any CSS colour.
sunColor: string; default —; Overrides the sun's ink, any CSS colour.
paperColor: string; default —; Overrides the paper; defaults to the page's background, warmed.
speed: number; default 1; How fast the field glides toward you, 0 (still) to 3.
horizon: number; default 0.42; Where the horizon sits, as a share of the height from the top, 0.2 to 0.7.
sunSize: number; default 0.24; The sun's diameter as a share of the height, 0.08 to 0.5.
haze: number; default 0.6; How strongly the haze stripes the sun and the sky, 0 to 1.
sun / defaultSun: number; default 0.62; Where the sun sits along the horizon, 0 left to 1 right; controlled or the uncontrolled start.
onSunChange: (sun: number) => void; default —; Fires when the pointer, a key or focus moves the sun, rounded to 0.01.
interactive: boolean; default true; The pointer over the scene, and focus moving between its children, steer the sun.
focusable: boolean; default false; Makes the scene a slider tab stop that steers the sun with the arrow keys, for a field with no controls on it.
label: string; default "Sun position"; Names the sun slider when focusable.
paused: boolean; default false; Holds the field still; the sun still moves.
seed: number; default 5; Seeds the hills and the ridge.
dpr: number; default 2; Cap on the canvas's device pixel ratio, at most 2.
className: string; default —; Sizes the scene; 256px tall by default.

Prop	Type	Default	Description
children	React.ReactNode	—	Content laid over the field in its own layer; it keeps every click and focus.
spacing	number	11	The furrows' spacing at the near edge, px: small is a fine engraving, large a few broad ribbons.
roll	number	0.5	How much the land rolls, 0 a flat field to 1 steep hills that hide the furrows behind them.
palette	"dusk" \| "harvest" \| "indigo" \| "moss"	"dusk"	The two inks the print is pulled in; the paper follows the page.
inkColor	string	—	Overrides the land's ink, any CSS colour.
sunColor	string	—	Overrides the sun's ink, any CSS colour.
paperColor	string	—	Overrides the paper; defaults to the page's background, warmed.
speed	number	1	How fast the field glides toward you, 0 (still) to 3.
horizon	number	0.42	Where the horizon sits, as a share of the height from the top, 0.2 to 0.7.
sunSize	number	0.24	The sun's diameter as a share of the height, 0.08 to 0.5.
haze	number	0.6	How strongly the haze stripes the sun and the sky, 0 to 1.
sun / defaultSun	number	0.62	Where the sun sits along the horizon, 0 left to 1 right; controlled or the uncontrolled start.
onSunChange	(sun: number) => void	—	Fires when the pointer, a key or focus moves the sun, rounded to 0.01.
interactive	boolean	true	The pointer over the scene, and focus moving between its children, steer the sun.
focusable	boolean	false	Makes the scene a slider tab stop that steers the sun with the arrow keys, for a field with no controls on it.
label	string	"Sun position"	Names the sun slider when focusable.
paused	boolean	false	Holds the field still; the sun still moves.
seed	number	5	Seeds the hills and the ridge.
dpr	number	2	Cap on the canvas's device pixel ratio, at most 2.
className	string	—	Sizes the scene; 256px tall by default.