A production component library·Now in private beta
stable Content

SDF Bento

An asymmetric bento grid of hairline-bordered content cells where span:2 items stretch full width.

Sign in to copy
Platform

Everything in one composable surface

Realtime sync

Changes propagate across every connected client in under 50ms, with optimistic local updates and automatic conflict resolution.

Edge delivery

Served from 300+ locations so assets land close to your users.

Granular roles

Scope access down to the field with policy-based permissions.

Audit trail

Every mutation is logged and queryable.

Open API

REST and GraphQL endpoints generated from your schema, fully typed and versioned out of the box.

SdfBento.tsx 84 lines · TypeScript

The full source is for members

Sign in and choose a plan to view and copy SdfBento.tsx. The live preview above is free to explore.

Sign in

How to use. Copy SdfBento.tsx into your project (it's self-contained — the styles ship with it and dedupe across instances in React 19). Theme it by setting --sdf-* tokens on any ancestor. No dependencies, no build step.

All React components
A Stacklumen Product