content-hub

Browser-based asset gallery for managing marketing assets. Visual grid with filter/search, brand context sidebar, and actions (preview, edit, generate). R2-ready manifest for future cloud sync. Use when browsing assets, managing content library, or generating new assets with brand context.

Stars 163

Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/data/content-hub

SKILL.md

Content Hub

Visual asset gallery for ClaudeKit Marketing.

Quick Start

bash

# Open gallery
node .claude/skills/content-hub/scripts/server.cjs --open

# Rescan assets
node .claude/skills/content-hub/scripts/server.cjs --scan

# Stop server
node .claude/skills/content-hub/scripts/server.cjs --stop

Or use command: /write:hub

Features

Gallery Grid: Thumbnails of assets/ folder
Filter/Search: By type (banners, designs, etc.) and keywords
Brand Sidebar: Displays user's colors and voice from docs/brand-guidelines.md
Actions: Preview, Edit in Claude, Copy path, Generate new
R2 Ready: Manifest schema supports Cloudflare R2 sync (UI disabled)

API Routes

Route	Purpose
`/hub`	Gallery HTML
`/api/assets`	Asset list JSON
`/api/brand`	Brand context JSON
`/api/scan`	Trigger rescan
`/file/*`	Serve local files

Manifest Schema

Assets stored in .assets/manifest.json with R2 fields:

json

{
  "id": "abc123",
  "path": "banners/hero.png",
  "category": "banner",
  "r2": {
    "status": "local",  // local|pending|synced|error
    "bucket": null,
    "url": null
  }
}

Scripts

Script	Purpose
`scripts/server.cjs`	HTTP server entry
`scripts/lib/scanner.cjs`	Scan assets directory
`scripts/lib/router.cjs`	HTTP routing
`scripts/lib/brand-context.cjs`	Extract brand guidelines

Integration

Command: /write:hub

Related Skills: brand-guidelines, ai-multimodal, design

Agents: content-creator, ui-ux-designer