Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 11 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# bb plugins

Seven bb plugins I use for product design work, kept together with the few build and repository tools they share. [![CI](https://github.com/brsbl/bb-plugins/actions/workflows/ci.yml/badge.svg)](https://github.com/brsbl/bb-plugins/actions/workflows/ci.yml)
Eight bb plugins I use for product design work, kept together with the few build and repository tools they share. [![CI](https://github.com/brsbl/bb-plugins/actions/workflows/ci.yml/badge.svg)](https://github.com/brsbl/bb-plugins/actions/workflows/ci.yml)

[bb](https://getbb.app) is an agentic IDE for running coding agents across projects, threads, and environments. Its plugins can add UI, commands, skills, and server capabilities; this repository is where I build and maintain mine.

Expand Down Expand Up @@ -72,6 +72,16 @@ Creates, edits, saves, and shares reusable mesh gradients from a visual studio b

Install: `bb plugin install git:https://github.com/brsbl/bb-plugins.git@plugin/mesh-gradient --yes`

### Endless

Frank Ocean's *Endless* as a bb palette — achromatic, grained, squared. Ten years to the day.

![The Endless palette in bb](plugins/endless/docs/screenshot.png)

[Source](plugins/endless) · [README](plugins/endless/README.md)

Install: `bb plugin install git:https://github.com/brsbl/bb-plugins.git@plugin/endless --yes`

### Timeline Comments

Attaches durable discussion threads to selected timeline text. Users and agents can reply, edit, resolve or reopen comments, review them together, and add open feedback to the composer for follow-up.
Expand Down
24 changes: 24 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

125 changes: 125 additions & 0 deletions plugins/endless/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,125 @@
# Endless

Frank Ocean's *Endless* as a bb theme family: `endless`, the achromatic
silver print, and `endless-color`, the same structure with rare pops sampled
from the film's painted stair.

Released August 19, 2016. This is the ten-year mark.

![The Endless palette, dark and light](docs/screenshot.png)

## Install

```bash
bb plugin install git:https://github.com/brsbl/bb-plugins.git@plugin/endless --yes
```

## Use

Activate either palette:

```bash
bb theme set plugin:endless:endless # the silver print
bb theme set plugin:endless:endless-color # silver + the stair accents
```

The palette is app-wide and stored server-side; light/dark mode stays a separate
per-client setting that each stylesheet layers on top of, so one theme covers
both. `bb theme reset` returns to the default without touching your favicon
color.

## The family

`endless-color` is generated from the `endless` stylesheet plus appended
light and dark override blocks in [`build/build-color.py`](build/build-color.py),
and a test asserts that derivation byte-for-byte. Radius, type, the sidebar
material and every
structural rule are therefore shared by construction — the variant can only
differ where it deliberately overrides: the silver field, the stair accents
(light blue, mustard, orange, red, olive), the foil violet, and the plywood
trim.

The complete generators and reference imagery live in [`build/`](build/),
outside the package `files` allowlist so installed plugins do not carry the
authoring sources. [`build/PROVENANCE.md`](build/PROVENANCE.md) records each
measured colour, its source region, exact value, and nearest pixel in the
committed image.

Type across the family follows the album's liner notes: Helvetica for the UI,
Courier for code, paths and terminals. Both are system faces — nothing is
embedded.

## The design

The album is a black-and-white visual record: a grainy near-black field, two
silver-gelatin photographs, printers' registration marks in the corners, a
greyscale step wedge down each edge, and a warehouse ceiling of fluorescent
tubes. Five moves carry that into a UI palette.

**Achromatic.** There is no accent hue. The neutral ramp is a warm-toned silver
print — the step wedge from the cover's edge strips — and every surface, border
and text tier is drawn from it.

**Light is the accent.** In dark mode `--primary` is pure `#ffffff`, the
fluorescent tube. Body text sits a step below at `#f4f1ec`, so a primary button
or a link reads as literally *lit* rather than merely tinted. Light mode inverts
the idea: `--primary` becomes `#0d0d10`, a slab of ink on paper.

**Squared.** `--radius` drops to `0`. Photographic prints, crop marks and
registration targets have no rounded corners.

**Two tones, not one.** Body text is warm-toned; file paths and the timeline are
cold (`#9fb8c4`). Two prints from the same negative, developed in different
chemistry. It is the only temperature shift in the theme, so it does an accent
color's job without adding one.

Semantics keep their hue but are toned rather than saturated, like a hand-tinted
print: destructive is the darkroom safelight, warning is sepia, success is
selenium, merged is a dusty violet. The ANSI terminal palette is deliberately
left at bb's defaults — a greyscale remap would erase the one place in the app
where color is load-bearing rather than decorative.

## Notes for anyone editing the stylesheet

**Canvas grain stays off.** Earlier builds raised both `--canvas` anchors to
compensate for a page-wide film-grain overlay. The canvas is now the measured
field directly. The sidebar keeps a separate paper mottle in light mode and a
zero-mean highlight/shadow grain in dark mode, so its texture does not lift the
surface away from the contrast value being tested.

**Panels sit above the field.** In dark mode cards, popovers and code wells sit
a step above the canvas rather than below it — the cover's own logic, where the
photographs are the lit planes and the black is the surround.

**`:root` beats bb's `.dark`.** They have equal specificity and this sheet loads
last, so every token pinned in the light block is pinned again in the dark block.
Dropping one leaks its light value into dark mode.

Contrast floors held throughout: text ≥ 4.5:1, non-text UI ≥ 3:1, including the
tight cases (the secondary text tiers over the hover fill).

**Code colors are not part of this plugin.** bb's plugin manifest accepts only
`{ id, name, description, css }` per theme — there is no field for a Pierre /
VS Code code theme, and the plugin SDK's `ThemeArea` is read-and-activate only.
So `bb theme show` reports `pierre-dark / pierre-light` for this palette: diff
*line* colors still follow `--diff-added` / `--diff-removed` from the stylesheet,
but syntax highlighting inside code blocks uses bb's default hues rather than
this theme's toned monochrome. A matching pair exists and works when the palette
is installed the other way, as a custom theme folder under
`<bb-data-dir>/theme/endless/` alongside `pierre-dark.json` / `pierre-light.json`.

**Fonts are system-native.** The family uses Helvetica Neue and Courier with
portable fallbacks; it embeds no font files. `theme.test.ts` fails the build if
a machine-specific path appears in either generated stylesheet.

## Develop

From the monorepo root:

```bash
npm ci
python3 plugins/endless/build/build.py 0.13 0.18 plugins/endless/themes/endless.css local
python3 plugins/endless/build/build-color.py plugins/endless/themes/endless-color.css plugins/endless/themes/endless.css
npm run check --workspace=bb-plugin-endless
bb plugin install "path:$PWD/plugins/endless" --yes
```
1 change: 1 addition & 0 deletions plugins/endless/assets/registration-mark.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
39 changes: 39 additions & 0 deletions plugins/endless/build/PROVENANCE.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
# Endless palette provenance

The theme family is generated from the source files in this directory. The
committed reference images are repository-only authoring inputs; the plugin's
`files` allowlist deliberately keeps them out of installed packages.

## Measured source colours

The target values below were recorded while sampling the source artwork. JPEG
encoding shifts several decoded pixels by one or two RGB levels, so the table
also records the nearest pixel in the committed image and its exact coordinate.

| Role | Source region | Authoring sample | Nearest committed pixel |
| --- | --- | --- | --- |
| Foil paper | `IMG_6519-cover-foil.jpeg`, upper paper field | `#E2E2E3` | `#E2E2E2` at `(1, 4)` |
| Foil violet | `IMG_6519-cover-foil.jpeg`, lower-right foil arc | `#6B5C84` | `#6C5C83` at `(763, 878)` |
| Maroon | `IMG_6521-stacked-blocks.jpeg`, top block | `#32221F` | `#31221F` at `(689, 32)` |
| Olive | `IMG_6521-stacked-blocks.jpeg`, second block | `#2D311C` | `#2D321C` at `(776, 168)` |
| Terracotta | `IMG_6521-stacked-blocks.jpeg`, red stair | `#A27369` | `#A2716A` at `(506, 451)` |
| Orange | `IMG_6521-stacked-blocks.jpeg`, orange stair | `#B17963` | `#B17864` at `(590, 633)` |
| Gold | `IMG_6521-stacked-blocks.jpeg`, yellow stair | `#C2A260` | `#C2A360` at `(562, 701)` |
| Sky | `IMG_6521-stacked-blocks.jpeg`, lower blue stair | `#719DB2` | `#709DB2` at `(283, 915)` |
| Mustard | `IMG_6523-welder.jpeg`, jacket chest | `#796220` | `#79621F` at `(486, 284)` |
| Glove olive | `IMG_6523-welder.jpeg`, right glove | `#838038` | `#838039` at `(618, 614)` |
| Workshop white | `IMG_6523-welder.jpeg`, upper wall | `#E6F3FB` | `#E6F3FB` at `(237, 0)` |

`build-color.py` documents how these samples map to the final semantic roles.
The generated accents preserve source hues while adjusting luminance to meet
the contrast floors recorded beside each token. Neutral ramps come from the
album cover, film still, and their printed step wedges.

## Rebuild

From the repository root:

```bash
python3 plugins/endless/build/build.py 0.13 0.18 plugins/endless/themes/endless.css local
python3 plugins/endless/build/build-color.py plugins/endless/themes/endless-color.css plugins/endless/themes/endless.css
```
Loading
Loading