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]>
1.4 KiB
1.4 KiB
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.