https://github.com/skwid138/opencode-logo-builder
Visual logo builder for opencode TUI — design multi-row ASCII art logos with 294 figlet fonts and live preview
https://github.com/skwid138/opencode-logo-builder
ascii-art cli developer-tools figlet github-pages logo-generator opencode terminal tui vanilla-js
Last synced: 3 days ago
JSON representation
Visual logo builder for opencode TUI — design multi-row ASCII art logos with 294 figlet fonts and live preview
- Host: GitHub
- URL: https://github.com/skwid138/opencode-logo-builder
- Owner: skwid138
- Created: 2026-05-24T20:07:38.000Z (25 days ago)
- Default Branch: main
- Last Pushed: 2026-05-25T02:06:04.000Z (25 days ago)
- Last Synced: 2026-05-25T02:23:46.603Z (25 days ago)
- Topics: ascii-art, cli, developer-tools, figlet, github-pages, logo-generator, opencode, terminal, tui, vanilla-js
- Language: JavaScript
- Homepage: https://skwid138.github.io/opencode-logo-builder/
- Size: 57.6 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# OpenCode Logo Builder
[](https://github.com/skwid138/opencode-logo-builder/actions/workflows/test.yml) [](LICENSE)
A static, no-build web app for designing colored FIGlet ASCII logos for the [`@skwid138/opencode-tui`](https://github.com/skwid138/opencode-tui) OpenCode plugin.
The builder lets you edit rows, choose a FIGlet font per row, split row text into colored inline blocks, preview the final terminal output, and export the plugin-compatible `logo` object:
```json
{
"rows": [
{
"segments": [
{ "text": "...", "color": "#5DBDB3" }
]
}
]
}
```
## Features
- **FIGlet font picker** with searchable category tags
- **Per-segment color** — assign hex colors to individual text blocks
- **Live terminal preview** — see your logo as it will appear in OpenCode
- **Export plugin-compatible config** — copy the `logo` JSON object directly into your opencode config
- **No build step** — open `index.html` and start designing
Font names, editor metadata, and preview background settings are not exported.
## Local usage
Open `index.html` directly in a browser. There is no framework, bundler, package manager, or build step.
The app uses a vendored copy of `figlet.js` v1.8.0 at `vendor/figlet.js` with a small ownership side-channel patch documented in [`PATCH.md`](PATCH.md). All 294 raw `.flf` fonts from figlet v1.8.0 are vendored under `vendor/fonts/`, and `font-manifest.js` lists those filenames for the searchable font picker. Runtime font loading fetches `vendor/fonts/.flf`, parses it with `figlet.parseFont()`, and falls back to `https://unpkg.com/figlet@1.8.0/fonts/.flf` if the local fetch fails.
When opened via `file://`, browsers usually reject relative `fetch()` requests to `vendor/fonts/`; the CDN fallback keeps font loading working as long as the browser can reach `unpkg.com`. Offline `file://` use may only render fonts already cached by the browser. `vendor/Standard.js` is committed for Node tests only; the browser uses the `.flf` files.
To verify that `font-manifest.js` matches the vendored fonts, run:
```sh
node scripts/verify-font-manifest.js
```
## Deployment
This repository is intended for GitHub Pages deployment from the `main` branch root. The expected public URL is:
```text
https://skwid138.github.io/opencode-logo-builder/
```
Deploy after the companion `opencode-tui` plugin change supporting inline segment colors has merged; exported configs use that newer schema.