Agent skill
visual-style
Color scheme and icons for consistent Autopilot output. Reference when formatting agent output and status messages.
Install this agent skill to your Project
npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/data/visual-style
SKILL.md
// Project Autopilot - Visual Style Guidelines // Copyright (c) 2026 Jeremy McSpadden jeremy@fluxlabs.net
Visual Style Guide
Consistent colors and icons for Autopilot output.
Agent Colors
Each agent has an assigned color for visual distinction:
| Agent | Color | ANSI Code | Hex | Use |
|---|---|---|---|---|
| planner | π΅ Blue | \033[94m |
#3b82f6 | Planning |
| validator | π’ Green | \033[92m |
#22c55e | Quality gates |
| token-tracker | π‘ Yellow | \033[93m |
#eab308 | Cost tracking |
| history-tracker | π€ Brown | \033[33m |
#a16207 | Persistence |
| model-selector | βͺ Gray | \033[90m |
#6b7280 | Model selection |
| architect | π£ Magenta | \033[35m |
#d946ef | Architecture |
| backend | π΅ Cyan | \033[96m |
#06b6d4 | Backend code |
| frontend | π Orange | \033[38;5;208m |
#f97316 | Frontend code |
| database | π΄ Red | \033[91m |
#ef4444 | Database |
| tester | π’ Lime | \033[38;5;118m |
#84cc16 | Testing |
| security | π΄ Dark Red | \033[31m |
#dc2626 | Security |
| debugger | π‘ Amber | \033[38;5;214m |
#f59e0b | Debugging |
| refactor | π΅ Indigo | \033[38;5;99m |
#6366f1 | Refactoring |
| documenter | βͺ Slate | \033[37m |
#94a3b8 | Documentation |
| devops | π Coral | \033[38;5;209m |
#fb7185 | DevOps |
| api-designer | π΅ Sky | \033[38;5;117m |
#0ea5e9 | API design |
| code-review | π£ Violet | \033[38;5;135m |
#8b5cf6 | Code review |
Status Icons
Task Status
| Icon | Meaning | When to Use |
|---|---|---|
| β | Success | Task/phase completed |
| β | Failed | Task/validation failed |
| π | In Progress | Currently executing |
| βΈοΈ | Paused | Waiting for input/approval |
| βοΈ | Skipped | Task skipped (already done) |
| π | Pending | Not yet started |
Validation Status
| Icon | Meaning | When to Use |
|---|---|---|
| β | Pass | Validation passed |
| β | Fail | Validation failed |
| β | Warning | Non-blocking issue |
| β | Running | Check in progress |
Cost/Budget
| Icon | Meaning | When to Use |
|---|---|---|
| π° | Cost | Cost information |
| π΅ | Budget | Budget thresholds |
| π | Stats | Statistics/metrics |
| π | Increase | Cost went up |
| π | Decrease | Cost went down (savings) |
Threshold Levels
| Icon | Level | When to Use |
|---|---|---|
| β | OK | Under warning threshold |
| β οΈ | Warning | At warning threshold |
| π | Alert | At alert threshold |
| π | Stop | At/over max threshold |
System Events
| Icon | Meaning | When to Use |
|---|---|---|
| π | Checkpoint | Checkpoint saved |
| βΆοΈ | Start | Execution starting |
| βΉοΈ | Stop | Execution stopped |
| π | Resume | Resuming from checkpoint |
| π | Complete | Project finished |
| πΎ | Save | Data saved |
| π | File | File operation |
| π§ | Tool | Tool execution |
| π | Deploy | Deployment |
| π | Security | Security related |
| π§ͺ | Test | Testing |
| π | Doc | Documentation |
Git Operations
| Icon | Meaning | When to Use |
|---|---|---|
| π | Commit | Git commit |
| π | Branch | Branch operation |
| β¬οΈ | Push | Git push |
| β¬οΈ | Pull | Git pull |
| π | Merge | Git merge |
Output Formats
Agent Spawn
π΅ planner β Creating phase plan
π΅ backend β Creating UserService
Task Progress
π 003.1 | Creating AuthService...
β
003.1 | AuthService | $0.04 | 2.1K tokens
Validation Results
π’ validator β Phase 003 Gate
β Build passes
β Tests pass (47/47)
β Coverage 87%
β Lint clean
β Security clean
β
APPROVED
Cost Updates
π° Cost: $4.36 / $50.00 (9%)
βββ Input: 245K tokens
βββ Output: 89K tokens
βββ Calls: 34
π By Model:
βββ Sonnet: $3.82 (88%)
βββ Haiku: $0.54 (12%)
βββ Opus: $0.00 (0%)
Checkpoint
π Checkpoint saved (phase_complete)
Phase: 003 of 008
Task: 003.4
Cost: $4.36
Threshold Alerts
β οΈ Warning: Cost $10.23 exceeds warning threshold ($10.00)
Continuing execution...
π Alert: Cost $25.12 exceeds alert threshold ($25.00)
Pause for confirmation. Continue? [y/N]
π Stop: Cost $50.05 exceeds maximum ($50.00)
Saving checkpoint and halting...
Phase Summary
π Phase 003 Complete
βββ Tasks: 4/4 β
βββ Duration: 12m 34s
βββ Cost: $1.23 (est: $1.50, -18% π’)
βββ Commits: 3
Project Summary
π Project Complete!
π Final Stats
βββ Phases: 8/8 β
βββ Tasks: 34/34 β
βββ Duration: 2h 15m
βββ Cost: $8.45 (est: $10.00, -16% π’)
βββ Commits: 28
πΎ Saved to history
View: /autopilot:config --history
Color Reset
Always reset colors after output:
\033[0m # Reset all formatting
Markdown Output (for .md files)
When writing to markdown files, use text-based indicators:
| Instead of | Use |
|---|---|
| π’ | [PASS] or β |
| π΄ | [FAIL] or β |
| π‘ | [WARN] or β |
| π΅ | [INFO] or βΉ |
Quick Reference
Common Patterns
# Agent starting work
{color}{icon} {agent} β {action}
# Task status
{status_icon} {task_id} | {description} | ${cost}
# Validation line
{check_icon} {check_name}
# Cost line
π° {label}: ${amount} / ${limit} ({percent}%)
# Checkpoint
π Checkpoint saved ({reason})
Agent Color Quick Map
planner = π΅ Blue
validator = π’ Green
token-tracker = π‘ Yellow
backend = π΅ Cyan
frontend = π Orange
database = π΄ Red
tester = π’ Lime
security = π΄ Dark Red
debugger = π‘ Amber
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
Didn't find tool you were looking for?