Omar SobhandClaude Opus 4.8
48730abd78
Add the WorkClaw design-reference docs (specs, manifests, tokens, motion, icon/asset references, gifs) under docs/, and move the platform spec/PRD/roadmap from the repo root into docs/. Co-Authored-By: Claude Opus 4.8 <[email protected]>
23 lines
1.4 KiB
Markdown
23 lines
1.4 KiB
Markdown
# Icon & Logo Asset Manifest (Computer Panel)
|
|
|
|
> Two icon classes: (A) brand service logos as external SVG files; (B) in-app UI glyphs = open-source lucide icons rendered with a gradient fill (stroke/fill = url(#mvp4-glyph-gradient-*)).
|
|
|
|
## A. Brand service logos (replace with our own / use official brand assets per their guidelines)
|
|
- Browser tile: /services/chrome.svg (Google Chrome logo)
|
|
- Slack tile: /services/slack.svg (Slack logo)
|
|
- NOTE: Chrome & Slack marks are third-party trademarks — use each vendor's official brand assets, don't recolor.
|
|
|
|
## B. In-app glyphs — lucide (ISC license, free for commercial use). 24x24 viewBox, gradient-filled.
|
|
- Claw Chat = lucide 'message-circle'
|
|
- Add Apps = lucide 'plus' (d: M5 12h14 / M12 5v14)
|
|
- Skills = lucide 'zap'
|
|
- Files = lucide 'folder'
|
|
- Routines = lucide 'bell'
|
|
- Settings = lucide 'settings' (gear)
|
|
- Browser empty state = lucide 'globe'; Routines error = lucide 'alert-circle'.
|
|
- Gradient: per-glyph linearGradient id 'mvp4-glyph-gradient-*' applied as both stroke and fill (gives the soft coral->? tint). Reproduce by wrapping a lucide icon and applying fill:url(#grad)/stroke:url(#grad).
|
|
|
|
## Recommendation
|
|
- Use the lucide icon set directly (free, ISC) for all UI glyphs — identical shapes, no IP concern.
|
|
- For Browser/Slack tiles use official Chrome/Slack brand SVGs (or your own integration logos); these are the only third-party-trademark assets.
|