The Block Protocol is an open standard for building block-based interfaces. It enables applications to make their interfaces extensible with interoperable components: blocks.
The following pages provide a practical introduction for developers who want to:
If you have any questions, please open or contribute to a discussion. You can also chat to us on Discord.
Blocks are the basic units we use to build pages on the modern web. They are rectangular sections that contain a set of features and functions. They are sometimes also called components or widgets.
Each block has a type that determines the kind of data it can display and edit. You're probably familiar with the most common block types such as paragraph, header, image, list, and table. Some block types have more advanced interactive features such as filtering, search, and sorting.
There are an infinite number of possible block types. One goal of the Block Protocol is to encourage developers to build and share brand new types of blocks that haven't been seen before, and for applications to offer users far more blocks than any one team could imagine or build.
Blocks can be added to webpages using plain HTML and/or JavaScript. Some modern content management systems (eg. WordPress, Squarespace) and applications (eg. Notion, Coda) allow you to add blocks to a page using a visual interface. With these block-based editors you can usually rearrange the order of blocks on a page using drag and drop. Blocks can be stacked on top of one another, arranged in columns, or embedded inside other blocks.
From a developer perspective, blocks encapsulate a set of specific functionality. Building a block is no different to writing a React, Vue, or Web Component – in fact, these are all ways you might implement a block. They are reusable elements that expect certain data to be passed to them (what we refer to as a block’s ‘schema’). For example, an image block might only accept an image URL in its src property, not a number.
Any block can become a Block Protocol block by meeting the requirements defined in the specification. These requirements define what data a block can accept and how they're allowed to edit that data.
Following these requirements allows BP blocks to do more than regular web blocks. This standardized way of handling data makes it possible to embed BP blocks across different web applications. BP blocks can read and write data to the applications they're embedded within without any extra setup or custom integrations (as long as both the block and embedding application adhere to the specification).
BP blocks can also be published on the Hub – an open-source registry where anyone can publish their blocks for other people to discover and use.
Any application can accept BP blocks, as long as they follow the requirements for embedding applications.