IntroducingContent BlocksAccessible, Performant, Engineered for ScalabilityA collection of frontend web components designed to build accessible and performant e-commerce and template experiences with ease.Browse ComponentsDocumentationBuilt for Responsiveness and ScalabilityFully Lazy LoadedFully Keyboard AccessibleZero dependencies, works with frameworks like jQuery or React
Why Content Blocks?

Content Blocks make building ecommerce and marketing sites faster and easier. Slots allow easy customization, and responsive properties make handling responsive breakpoints a breeze.

This library was developed to address the common challenges experienced when building custom frontend architectures for Fortune 500 companies. Content Blocks make working with changing requirements simple because all the functionality is encapsulated within each component, and can be used in any slot.

The individual components handle accessibility, lazy loading, and asynchronous rendering. To learn more about how these features work, take a look at the Documentation.

Getting Started

Javascript Bundle

npm install @content-blocks/js;
import { ContentLine } from '@content-blocks/js';

React Bundle

npm install @content-blocks/react
import { ContentLine } from '@content-blocks/react';
Visit the Documentation page for instructions to include Content Blocks in your application. You can also learn more about slots and responsive properties.
Examples
  1. HTML5 Ecommerce Page
  2. NextJS Content Blocks Site (React)
A suite of optimized components for every content experience