Backgrounds

Honeycomb lattice

Honeycomb lattice: A honeycomb of outlined hexagons tiling a container, with shared edges drawn only once so every seam stays a single hairline.

Sensor mesh

212 hex cells reporting across the apiary

A cell lights for the hour after its sensor checks in.

flat orientation34px radius6 live

Using Honeycomb lattice

Honeycomb lattice uses the wide preview frame with a dark theme setting.

Customize the preview

These controls are passed to the demo. Defaults and limits describe the preview; consult the implementation for its full prop API.

Control	Type	Default	Preview limits
`radius`	`number`	`34`	From 14 to 80; step 2
`gap`	`number`	`6`	From 0 to 30; step 1
`orientation`	`select`	`flat`	Options: flat, pointy
`litCells`	`number`	`6`	From 0 to 20; step 1
`accentColor`	`color`	`#F5C542`	No additional limit in the metadata.

Which frameworks are available for Honeycomb lattice?

Honeycomb lattice is available for React, Vue, Svelte, Astro, HTML. The live preview uses React; the source observations below apply to index.tsx. Check the selected port before relying on the same interactions.

What does Honeycomb lattice depend on?

The React metadata lists these npm dependencies beyond React: clsx, tailwind-merge.

What accessibility details are visible in Honeycomb lattice?

The React source for Honeycomb lattice includes: attributes and handlers (aria-hidden). These are source observations. Verify accessible names, focus order and keyboard behavior in the composed page.

How does Honeycomb lattice handle reduced motion?

Honeycomb lattice reads the motion preference in its React source through matchMedia(prefers-reduced-motion). Check the full implementation, shared styles and selected port with reduced motion enabled; these observations do not establish that every animation stops.

Connect your agent

Related open components

Still of the Blinking grid pattern component, a Fieldbook UI component in Backgrounds.

1668Blinking grid patternBackgroundsA hairline square grid where scattered cells fade up and back down, each hopping to a fresh cell when its blink ends.

Still of the Grain Flicker component, a Fieldbook UI component in Backgrounds.

1972Grain FlickerBackgroundsA grain layer that redraws itself every few frames, so flat backgrounds get the restless flicker of a running projector instead of a fixed texture.

Still of the Aurora band glow component, a Fieldbook UI component in Backgrounds.

2110Aurora band glowBackgroundsA soft ribbon of light lying across a dark frame, its edge wandering on layered noise while the color walks along its length.

Still of the Aurora veil component, a Fieldbook UI component in Backgrounds.

1526Aurora veilBackgroundsA full-bleed background of three drifting ribbons of light that add up where they cross, over a dark ground, with a caption layer that stays readable.

Still of the Bar wave matrix component, a Fieldbook UI component in Backgrounds.

2112Bar wave matrixBackgroundsA grid of short bars where each bar slides along its own track, and the phase offset from row to row turns the whole grid into a travelling wave.

Still of the Branching bolt component, a Fieldbook UI component in Backgrounds.

1924Branching boltBackgroundsA jagged bolt walks down the frame with short forks dying off its sides, flares white on the strike, then fades to an afterimage.