Components, templates, design and tools for agentic work Private alpha · free for now

One workbench for the whole agency.

Baselumen is where the build starts: a component library in every framework, whole-site templates that import into Terminal, a designer for print and brand work, and a bench of web tools and audits — one app, one account, one plan.

Four systems, one app.

Components for the build, templates for the start, a designer for the brand and tools for the proof. Each system has its own page, one level deeper.

  • Components

    185 components with clean BEM classes, in every build: HTML + CSS you can paste anywhere, typed React, and Vue and Svelte generated from the same source, plus a Copy for Terminal block. Component Studio and your workspace's custom components sit beside the library, and any of them can be pinned to a Terminal site.

  • Templates

    12 whole sites, not single components: seven-page Astro projects with their own navigation, dark mode and layout system, written fully static so they import into Terminal without losing a section.

  • Design

    A designer for the print and brand work around a site: artboards measured in millimetres with trim and bleed marked, 9 presets from business cards to A4, and 26 vector tools including the pen, the shape builder and gradients. Every design is filed by client in the design library, exports as SVG or PNG, and pushes to a Terminal site's assets.

  • Tools & audits

    14 working tools: converters and generators that run in the browser, and graders that take a URL — SEO, accessibility, speed, security headers, schema, landmarks — and hand back a report. Several graders export branded PDF reports, and finished runs are kept under Reports.

Every build. One source.

185 components with clean BEM classes, in every build: HTML + CSS you can paste anywhere, typed React, and Vue and Svelte generated from the same source, plus a Copy for Terminal block. Component Studio and your workspace's custom components sit beside the library, and any of them can be pinned to a Terminal site.

  • HTML + CSS, React, Vue, Svelte and Terminal
  • Design tokens theme every component
  • Component Studio and custom components

Copy as

Build 185 components 186 components 185 components 185 components 185 components
  • Files 2 files SdfStatStrip.tsx sdf-stat-strip.vue sdf-stat-strip.svelte Markup + <style>, one paste
  • Copy Copy HTML + Copy CSS Copy React Copy Vue Copy Svelte Copy for Terminal

Plain markup and a stylesheet. No build step and no dependencies — paste it into any framework or a bare page. One typed .tsx per component, carrying the same DOM and the same sdf- class names as every other build here. One .vue single-file component. Its styles ship with it, unscoped, so your --sdf-* overrides still reach them. One .svelte single-file component. Styles ship with it, unscoped, so your --sdf-* overrides still reach them. Markup and stylesheet as one block, shaped for the Terminal designer — paste it into its code panel.

The library’s Copy as picker: one card, every build. Switching it changes what every card hands over, not which library you are in. The drawing is the Baselumen component library with the sdf-stat-strip card and its source. Choosing React, Vue, Svelte or Terminal changes the card's copy button to Copy HTML and Copy CSS, Copy React, Copy Vue, Copy Svelte, Copy for Terminal, and the code beside it to that build's file.

Drawn to size. In millimetres.

A designer for the print and brand work around a site: artboards measured in millimetres with trim and bleed marked, 9 presets from business cards to A4, and 26 vector tools including the pen, the shape builder and gradients. Every design is filed by client in the design library, exports as SVG or PNG, and pushes to a Terminal site's assets.

  • Print-accurate artboards in mm, with bleed
  • Pen, shapes, type, gradients and effects
  • Push to a Terminal site, filed by client

Document

Size
Width (mm) 100
Height (mm) 100
Bleed (mm) 0
Background None
The designer’s document presets: real trim sizes in millimetres, each with its printer’s bleed. A logo starts with no background. The drawing is the Baselumen designer with an artboard and its Document panel. Choosing a size — Logo · square (100 × 100 mm); Logo · horizontal (200 × 60 mm); Business card · 85 × 55 mm; Business card · 3.5 × 2 in; Business card · 65 × 65 mm; Postcard · A6 (148 × 105 mm); Flyer · A5 (148 × 210 mm); Document · A4 (210 × 297 mm); Social · 1080 × 1080 px @ 72dpi — resizes the artboard to it and shows its bleed as a dashed trim line.

Counted when this page is built.

Components
185
Templates
12
Artboard presets
9
Vector tools
26
Tools and audits
14
MCP tools
32

Proof you can hand over. Graded by URL.

14 working tools: converters and generators that run in the browser, and graders that take a URL — SEO, accessibility, speed, security headers, schema, landmarks — and hand back a report. Several graders export branded PDF reports, and finished runs are kept under Reports.

  • Tailwind → CSS, JSON-LD, contrast checks
  • SEO + AEO, a11y, speed, security audits
  • Reports you can hand to a client

Audit

  • Graders5
  • Runs spent5

Each grader is a full run and counts toward your allowance. The scores in this drawing are illustrative.

Advanced Audit: one URL through every grader at once, each saved as its own run. The scores drawn here are illustrative, not a real result. The drawing is the Advanced Audit tool. A URL is entered and Audit site pressed; the 5 graders — SEO + AEO, Accessibility, Security Headers, Schema, Maintainability — and optionally Speed run three at a time, each card filling with its score, and an overall mean appears above them.

One plan carries all of it. Three to choose from.

Baselumen comes with every Stacklumen plan, beside the Hub and Terminal: Free at $0, Pro at $24 a month and Agency at $29.99 a month. Free includes the HTML and CSS of every component, the free set in every build, 10 audit runs a month and 10 designs in the library. Pro and Agency add every build of every component, MCP and the CLI, more runs and unlimited designs; Agency adds clients and guests. Templates are licensed one at a time from the Marketplace, on any plan.

Private alpha: billing is not switched on. A signed-in account uses all of it for free, and nothing is charged.

The whole agency, signed in.

Components for the build, templates for the start, designs for the brand, tools for the proof.

Private alpha: billing is not switched on