• /
    • Web Components

Web Components

Drop-in web components for displaying OP data on any page

Last modified 2026-05-01

Table of content
  1. How they work
  2. In this section

Note: Web components hosted at octothorp.es will likely see design updates in v0.7 with the rest of the site. Spec should not change.

See the components live on the demo site.

How they work

Each component is a self-contained JavaScript module. Load one with a <script> tag and use it like any HTML element. Attributes map directly to API query parameters — no JavaScript required.

<script type="module" src="https://octothorp.es/components/octo-thorpe.js"></script>
<octo-thorpe>your-tag</octo-thorpe>

The components talk to the OP API at https://octothorp.es by default. You can point them at any OP server with the server attribute.

In this section

Component reference — Attributes, render modes, and CSS variables for each component: <octo-thorpe>, <octo-backlinks>, <octo-multipass>, <octo-multipass-loader>, and <octo-badge>.

Building components — How to create a new component using the shared store pattern.