37 blocks.
Every layout you need.
7 categories from layout to ecommerce. Each block has typed attributes, design token support, and maps directly to a React component on the frontend.
CATEGORIES
7 categories. One system.
Every block shares the same attribute system — radius Tier, color Mode, spacing Density. Change one token, change every block.
Layout
THE EDITING EXPERIENCE
Build pages the way you think about them.
Drag blocks, insert patterns, nest sections, tweak tokens. Visual
editing that produces real code.
Radius tiers
Color modes
Light, dark, and brand modes on every block. Mix modes on a single page
— a dark hero followed by light content followed by a brand-colored CTA.
All automatic.
InnerBlocks nesting
Blocks inside blocks. A hero section contains headings, paragraphs,
buttons, and images — all independently editable. A feature grid contains
cards, each with their own content. Complex layouts, zero complexity for
the editor.
Spacing density
Compact, comfortable, or generous. Controls padding at section,
component, and element levels. Dense dashboards or airy marketing
pages — same blocks, different density.
13 ecommerce blocks.
WooCommerce-ready blocks for headless storefronts. Build complete
product pages, catalogs, and checkout flows — all rendering on a fast
Next.js frontend.
HOW IT WORKS
WordPress block → React component.
Defined in WordPress, queried via GraphQL, rendered in React, delivered as semantic HTML.
