The AI agent dashboard your team actually wants to look at.

A cyberpunk command center for monitoring AI agent fleets in real-time. Two views: an orbital solar system visualization and a full mission control dashboard. Works with any agent framework.

Zero dependencies. Static HTML files. No build step. No npm install.

Mission Control — real-time agent monitoring with cyberpunk UI.

Solar System — your agents orbiting in real-time.

What You Get

Mission Control (mission-control.html)

A full-featured dashboard with:

• Agent Roster — live status, model, skills, and channel tags for every agent
• Scheduled Missions — cron job monitoring with OK/ERR status
• System Vitals — RAM gauge, uptime, platform info with Chart.js graphs
• KPI Streams — revenue, API usage, or any metrics you track
• Channels & Providers — Slack, Telegram, WhatsApp, API status at a glance
• Live ticker — scrolling status bar across the bottom
• Particle network background — tsParticles with interactive hover effects
• Scanline overlay — CRT retro feel
• Demo mode — works out of the box with realistic sample data

Solar System (index.html)

An orbital visualization where:

• The Sun is your core system / gateway
• Each planet is an AI agent (size = importance, speed = activity)
• Moons are sub-agents or tools
• Rings (Saturn-style) indicate agents with cron jobs
• Click any planet for detailed stats

Deploy in 30 Seconds

Or run locally:

git clone https://github.com/Audazia/solar-system-agents.git
cd solar-system-agents
open mission-control.html

That's it. The dashboard loads with demo data showing 12 agents, 11 cron jobs, 4 channels, and 4 model providers. Everything renders at 60fps.

Configure Your Agents

Edit config.js to set up your own fleet:

const CONFIG = {
  brand: {
    name: 'MY COMPANY',
    subtitle: 'MISSION CONTROL',
    centerTitle: 'AI OPERATIONS HQ',
  },

  agents: [
    {
      id: 'researcher',
      name: 'RESEARCHER',
      model: 'claude-sonnet-4-6',
      role: 'Deep research & analysis',
      tier: 'command',       // 'command' | 'operations' | 'support'
      premium: true,         // highlighted card
      skills: 8,
      channels: ['API', 'SLACK'],
      status: 'active',      // 'active' | 'idle' | 'error' | 'dormant'
    },
    // ... add more agents
  ],

  crons: [
    { agent: 'RESEARCHER', name: 'Daily Report', schedule: '06:00', status: 'ok' },
  ],

  channels: [
    { name: 'Slack', icon: '\u2709', status: 'online', detail: '4 CHANNELS' },
  ],

  providers: [
    { name: 'Anthropic', detail: 'claude-sonnet-4-6', status: 'active', label: 'PRIMARY' },
  ],
};

See config.js for the full configuration reference with all available options.

Connect Live Data

Option 1: API Polling (built-in)

Set your gateway URL in config.js:

gateway: {
  url: 'http://localhost:8080',
  healthEndpoint: '/health',
  statusEndpoint: '/api/status',
  refreshInterval: 15000,
},

The dashboard polls your API every 15 seconds and updates agent status dots and last messages.

Option 2: Direct JavaScript

Update agent data from your own API:

async function syncAgents() {
  const data = await fetch('/api/agents').then(r => r.json());
  data.forEach(agent => {
    const dot = document.getElementById('dot-' + agent.id);
    if (dot) dot.className = 'status-dot ' + (agent.active ? 'green' : 'yellow');
  });
}
setInterval(syncAgents, 10000);

Option 3: WebSocket (real-time)

const ws = new WebSocket('ws://localhost:8080/agents');
ws.onmessage = (e) => {
  const update = JSON.parse(e.data);
  const dot = document.getElementById('dot-' + update.id);
  if (dot) dot.className = 'status-dot ' + update.statusClass;
};

Works With Any Framework

• CrewAI / LangChain / LangGraph
• AutoGPT / BabyAGI
• OpenAI Assistants API
• Semantic Kernel
• Custom REST/WebSocket agents
• OpenClaw (built with this)

Use Cases

Hosting

Roadmap

• Solar System orbital visualization
• Mission Control dashboard
• Configurable agents, crons, channels, providers
• Demo mode (works without config)
• Live data polling via API
• Mobile responsive layout
• Framework adapters (CrewAI, LangChain, AutoGPT)
• Agent-to-agent communication lines
• Asteroid belt for queued tasks
• Comet events for alerts/incidents
• Custom themes (dark/light/custom)
• Docker image with built-in API server
• SaaS hosted version with auth + team features
• Agent marketplace & templates
• Webhooks & notification integrations

Contributing

PRs welcome. The codebase is intentionally simple — static HTML with inline CSS and JS. No build tools. Keep it that way.

# Fork, clone, edit, open in browser to test

License

MIT License. Use it however you want.

Built by AUDAZ.IA — We build AI agent infrastructure.

If this helps you, star the repo. It helps others find it.